Question

我正在尝试编写一个ToDo-App，但我在开始时对我的Checkbox有一个问题......

模板：

<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绑定。如文档中所述，这是不可能的：

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

其次，你必须看看Ember.js View Context changes。您的绑定必须使用{{view.content.title}}和{{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>

the associated JSFiddle。

ToDo App无法正常运行

1 个答案: