灰燼動作阻止設置復選框值

Question

在余燼應用程序中，我想通過循環動態呈現一組復選框，如果已選中兩個復選框，則禁用所有未選中的復選框。

當選中具有更改操作的復選框時，將值設置為“ true”時遇到問題。 對於下面的例子checkbox.value沒有得到選中該復選框時設置。

{{ input type="checkbox" disabled=checkbox.disabled checked=checkbox.value change=(action "disableCheckboxes" val)}} {{checkbox.label}}

但是，當我刪除操作時，它會被設置：

{{ input type="checkbox" disabled=checkbox.disabled checked=checkbox.value}} {{checkbox.label}}

JSFiddle上的完整示例

如何在仍執行操作的同時設置值？ 還是在已經選擇2時禁用未選中復選框的更好方法？

Answer 1

好吧，首先您可以使用一個動作。 簽出這個余燼 。

---

但是我建議直接將您的值綁定到目標對象。 看這里 。

這個想法基本上是包裝您的數組並在包裝中計算isDisabled：

boxes:[{id:1,value:true},{id:2},{id:3}],
boxArr: Ember.computed('boxes.@each.value', {
  get() {
    let disableOthers = Ember.get(this, 'boxes').filterBy('value', true).get('length') >= 2;
    return Ember.get(this, 'boxes').map(origin => {
      return {
        origin,
        disabled: disableOthers && !origin.value,
      };
    });
  }
}),

然后，您可以在模板中使用它：

{{#each boxArr as |box|}}
  {{input type="checkbox" disabled=box.disabled checked=box.origin.value}} {{box.origin.id}}
{{/each}}

---

存檔的第三種方法是使用助手。 您可以僅具有一個已計算的屬性，說明是否應禁用所有具有value=false復選框，然后使用and and not helper來設置disabled=(and disableFalseCheckboxes (not box.value) 。為此，請檢出ember-truth-helpers 。