Question

我输入了type =“checkbox”

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

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

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

我已经查看了复选框。使用此答案Trigger an action on the change event with Ember.js checkbox input helper?

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'将会更改。所以我可以用选定的属性过滤模型。也可以使用params发送行动

ember动作后复选框丢失状态

2 个答案: