我应该在哪里保持列表的选择状态？

Question

我使用的是烬1.0.0-pre4。

我想显示一个模型实例列表。用户应该能够通过点击在每行中呈现的按钮或复选框来选择多个列表条目。

我设法显示列表。但我不知道如何管理选择状态。当我将{{view Ember.Checkbox checkedBinding="isSelected"}}放入模板中时，选择状态将保留在我的模型中。但我不认为这是最好的地方。我认为选择状态属于控制器或视图状态。

你能告诉我存储和访问（多个）列表选择状态的最佳方式吗？

Answer 1

的方法之一是刚在控制器中的第二个列表：

App.FooController = Ember.ArrayController.create({ 
    selectedContent: [], 
    selectToggle: function(event) { 
    var selectedContent; 
    selectedContent = this.get(selectedContent); 
    if (selectedContent.contains(event.context)) { 
     return this.set('selectedContent', selectedContent.without(event.context)); 
    } else { 
     return this.get('selectedContent').push(event.context); 
    } 
    } 
}); 

<script type="text/x-handlebars" data-template-name="index"> 
    <ul> 
    {{#each foo in controller}} 
      <li {{action selectToggle foo}}>{{foo.name}}</li> 
    {{/each}} 
    </ul> 
</script> 

这只是维持在控制器单独列出，并推动移除基于/上是否被选择的项目。

您也可以使用Ember.ObjectProxy通过“isSelected”属性来增加foo对象的值。

App.FooController = Ember.ArrayController.create({ 
    selectedContent: @get('content').map(function(item){ 
    Ember.ObjectProxy.create({ 
     content: item 
     isSelected: false 
    }); 
    }); 
}); 

<script type="text/x-handlebars" data-template-name="index"> 
    <ul> 
    {{#each foo in controller.selectedContent}} 
      <li {{bindAttr class= "foo.isSelected"}}{{action selectToggle foo}}>{{foo.name}}</li> 
    {{/each}} 
    </ul> 
</script> 

然后在你的selectToggle方法中，你恰好设置foo的isSelected属性。