Ember.Select视图抱怨通过的值

Question

我有一个Ember.js（1.0.0）应用程序，我试图实现内置的Ember.Select视图。

该应用程序显示了三个任务列表：inProgress,completed和unassigned。用户可以过滤相应项目显示的任务。这就是Ember.Select视图进来。然而，当我加载路线，灰烬向我吠叫约的价值，我给它的类型：

Assertion failed: The value that #each loops over must be an Array. You passed projects.all

Uncaught TypeError: Object projects.all has no method 'addArrayObserver'

Uncaught Error: Something you did caused a view to re-render after it rendered but before it was inserted into the DOM.

我一直在摔跤几个小时，尝试下面的代码不同的排列 - 我知道我必须丢失的东西明显，因为它只是不能难以获得这样一个简单的组件来正常工作。希望你们能指引我朝正确的方向发展。

这里是我的路线：

Bee.TasksIndexRoute = Bee.Auth.Route.extend 
    setupController: (ctrl) -> 
     # get tasks 
     Bee.Auth.send 
      url: Bee.endpoint "/tasks" 
     .done (tasks) -> 
      ctrl.set "tasks.all", tasks 
     # get projects 
     Bee.Auth.send 
      url: Bee.endpoint "/projects" 
     .done (projects) -> 
      ctrl.set "projects.owned", projects.owned 
      ctrl.set "projects.participating", projects.participating 
      ctrl.set "projects.all", projects.owned.concat projects.participating 

这里是我的控制器：

Bee.TasksIndexController = Ember.ObjectController.extend 
    project: null 
    content: 
     tasks: 
      all: [] 
      inProgress: [] 
      completed: [] 
      unassgined: [] 
    projects: 
     all: [] 
     owned: [] 
     participating: [] 
    visible: (-> 
     ctrl = @ 
     # filter tasks here    
    ).property "project" 

这里是我的模板：

<script type="text/x-handlebars" id="tasks/index"> 
    <div class="center-pane"> 
     <div class="top_options"> 
      <div class="project_filter"> 
       <strong>Viewing: </strong> 
       {{view Ember.Select 
        content=projects.all 
        optionValuePath='content._id' 
        optionLabelPath='content.title' 
        value=project 
        prompt='All Tasks' 
       }} 
      </div> 
      <strong class="gold-gradient option_button"> 
       {{#link-to 'tasks.create' classNames='new_task'}}Create Task{{/link-to}} 
      </strong> 
     </div> 
     <div class="col3"> 
      <div class="col-header in-progress light-gradient"> 
       <h3>In Progress</h3> 
      </div> 
      <div id="tasks_active_list"> 
       {{#if visible.inProgress.length}} 
        <ul>{{#each visible.inProgress}}{{view Bee.TaskListView}}{{/each}}</ul> 
       {{else}} 
        <p class="no_projects">None</p> 
       {{/if}} 
      </div> 
     </div> 
     <div class="col3"> 
      <div class="col-header completed light-gradient"> 
       <h3>Completed</h3> 
      </div> 
      <div id="tasks_closed_list"> 
       {{#if visible.completed.length}} 
        <ul>{{#each visible.completed}}{{view Bee.TaskListView}}{{/each}}</ul> 
       {{else}} 
        <p class="no_projects">None</p> 
       {{/if}} 
      </div> 
     </div> 
     <div class="col3"> 
      <div class="col-header unassigned light-gradient"> 
       <h3>Unassigned</h3> 
      </div> 
      <div id="tasks_unassigned_list"> 
       {{#if visible.unassigned.length}} 
        <ul>{{#each visible.unassigned}}{{view Bee.TaskListView}}{{/each}}</ul> 
       {{else}} 
        <p class="no_projects">None</p> 
       {{/if}} 
      </div> 
     </div> 
    </div> 
</script> 

任何有识之士将非常感激。我不知道Ember.Select是罪魁祸首，因为当我用一个简单的替换：

<select> 
    {{#each projects.all}} 
     <option value="{{_id}}">{{title}}</option> 
    {{/each}} 
</select> 

...它呈现很好 - 但是我需要使用Ember.Select这样我就可以值绑定到project财产在TasksIndexController - 因为我会用它作为可见的函数来触发visible函数。

Answer 1

尝试将projects.all设置为null。也许ember select在类上的pojo默认数组有问题。

Bee.TasksIndexController = Ember.ObjectController.extend 
    project: null 
    content: 
     tasks: 
     all: [] 
     inProgress: [] 
     completed: [] 
     unassgined: [] 
    projects: 
    all: null 
    owned: [] 
    participating: [] 
    visible: (-> 
    ctrl = @ 
    # filter tasks here    
).property "project" 



setupController: (ctrl) -> 
    # get tasks 
    Bee.Auth.send 
     url: Bee.endpoint "/tasks" 
    .done (tasks) -> 
     ctrl.set "tasks.all", tasks 
    # get projects 
    Bee.Auth.send 
     url: Bee.endpoint "/projects" 
    .done (projects) -> 
     ctrl.set "projects.owned", projects.owned 
     ctrl.set "projects.participating", projects.participating 
     ctrl.set "projects.all", projects.owned.concat projects.participating 

这里有一个简单的例子：http://emberjs.jsbin.com/aletIyU/3/edit