复选框在余烬操作后失去状态

Question

输入类型="checkbox"

<input type="checkbox"  {{action 'checkInvoice' item.number}}/>

ember调用动作后，复选框失去状态。这是一个简单的动作代码

checkInvoice:function(number){
            var invoices=this.get('invoices');
            var model=this.get('model');
            model.forEach(function(item){
                if (item.number===number) {
                    invoices.pushObject(item);
                }
            });
            return;
        }

成员们是怎么对待的?或者我可以用ember helper达到相同的结果(如何设置动作参数)?

{{input type="checkbox" action='checkInvoice' }}

Answer 1

您可以为模型中的每个项目定义一个itemController，将复选框的checked属性绑定到itemController中的一个属性，并观察itemController中的属性来处理将对象推入另一个数组。

App.IndexController = Ember.ArrayController.extend({
  invoices: [],
  itemController: 'indexItem'
});
App.IndexItemController = Ember.ObjectController.extend({
  isCheckedChanged: function(){
  if(this.get('isChecked')) {
    this.get('parentController.invoices').pushObject(this.get('content'));
  } else {
    this.get('parentController.invoices').removeObject(this.get('content'));
  }
}.observes('isChecked')

});

模板中:

{{#each item in model}}
  <li>
    {{input type="checkbox" checked=item.isChecked}}
    {{item.name}}
  </li>
{{/each}}

jsbin .

Answer 2

我已经完成了view for checkbox。使用Ember.js复选框输入助手触发更改事件的操作?

export default Ember.Checkbox.extend({
    hookup: function () {
        var action = this.get('action');
        if (action) {
            this.on('change', this, this.sendHookup);
        }
    }.on('init'),
    sendHookup: function (ev) {
        var action = this.get('action'),
            controller = this.get('controller');
        controller.send(action, this.$().prop('checked'));
    },
    cleanup: function () {
        this.off('change', this, this.sendHookup);
    }.on('willDestroyElement')
});

这是我的复选框

 {{view "checkbox" action='testaction' checked=item.selected }}

和点击移动后的值'selected'将改变。我可以过滤带有选定属性的模型。也可以通过参数