为什么使用 itemController 会呈现空项目的集合？

Question

我目前正在学习 Ember，同时使用 ember-cli 学习 todomvc 教程：http://thetechcofounder.com/getting-started-with-ember-js-using-ember-cli/

我正在编辑待办事项的部分，需要在TodoController 中添加editTodo 操作。到目前为止一切顺利，但它还说在 each 车把助手上使用 itemController 来告诉每个待办事项使用特定的控制器

。

问题是当我在模板中将itemController 添加到each 时（使用Emblem.js：each itemController='todo'），模板不再呈现集合中每个项目的标题，它只会将它们呈现为空白：

我不明白为什么会这样。

模板提取

section#main
  ul#todo-list
    each
      li class={isCompleted:completed}
        if isEditing
          input.edit
        else
          = input class='toggle' type='checkbox' checked=isCompleted
          label{action 'editTodo' on='doubleClick'}= title
          button.destroy
  input#toggle-all type='checkbox'

控制器提取

`import Ember from 'ember'`

TodoController = Ember.Controller.extend
  actions:
    editTodo: ->
      @set 'isEditing', true

`export default TodoController`

Answer 1

项目控制器必须是 Ember.ObjectController 才能成功呈现每个项目及其相关数据。 ObjectControllers 用于装饰 ArrayController 中的单个项目。使用 'TodosListController' ArrayController 中的 itemController 属性来声明项目控制器：

    itemController: 'todo',

然后，当按照参考教程中的建议创建“待办事项”项目控制器类定义时，请注意 Ember CLI 的“生成控制器”命令将创建一个标准的 Ember 控制器。标准控制器和 ArrayControllers 代表多个项目（如“TodosController”或“TodosListController”）。因此，TodoController 应该扩展 Ember.ObjectController 来表示单个项目：

    `import Ember from 'ember'`

    TodoController = Ember.ObjectController.extend
      actions:
        editTodo: ->
          @set 'isEditing', true

    `export default TodoController`

一个标准的 Ember.Controller，正如问题所发布的，当通过“每个”帮助器传递时，无法正确显示每个单独的待办事项，因为标准控制器的模型引用了所有记录的过滤集键入“todo”，而不是特定的单个 todo 记录。

我创建了一个JS Bin 来说明 - 只需在使用 Ember.Controller 和使用 Ember.ObjectController 作为“TodoController”之间切换，即可看到标准控制器失败。

另外，这不是问题的原因，但以防万一它被忽略了，列表项类属性声明中缺少“isEditing:editing”：

    section#main
      ul#todo-list
        each itemController='todo'
          li class={isCompleted:completed, isEditing:editing} // <-- here
            if ...