jquery - ToDo 应用程序无法正常工作

Question

我试图编写一个 ToDo-App，但我的复选框一开始就有问题......

http://jsfiddle.net/LRQyv/

模板：

<script type="text/x-handlebars">
  {{view Todos.CreateTodoView id="new-todo" placeholder="What has to be done?"}}
  {{#collection contentBinding="Todos.todosController" tagName="ul"}}
      {{view Em.Checkbox titleBinding="content.title" valueBinding="content.isDone"}}
  {{/collection}}
</script>​

编码：

window.Todos = Ember.Application.create();
Todos.initialize();

Todos.Todo = Ember.Object.extend({
    title: null,
    isDone: false
});

Todos.todosController = Ember.ArrayController.create({
    content: [],
    createTodo: function(title) {
        var todo = Todos.Todo.create({title: title});
        this.pushObject(todo);
    }
});

Todos.CreateTodoView = Ember.TextField.extend({
    insertNewline: function() {
        var value = this.get('value');
        if (value) {
            Todos.todosController.createTodo(value);
            this.set('value', '');
        }
    }
});​

..添加ToDo-Item时为什么没有添加标签的任何想法？

Answer 1

您的代码中有两个问题，首先，您期望Ember.Checkbox允许title绑定。这是不可能的，如文档中所述：

您可以label在使用 Ember.Checkbox 的模板中自己添加标签。

其次，您必须查看Ember.js View Context changes。您的绑定必须使用{{view.content.title}}and {{view.content.isDone}}。

这是修改后的模板：

<script type="text/x-handlebars">
  {{view Todos.CreateTodoView id="new-todo" placeholder="What has to be done?"}}
  {{#collection contentBinding="Todos.todosController" tagName="ul"}}
      <label>
        {{view Em.Checkbox labelBinding="content.title" valueBinding="view.content.isDone"}}
        {{view.content.title}}
      </label>
  {{/collection}}
</script>​

以及相关的 JSFiddle。