templates - ArrayController に Ember のモデルが含まれていない場合、bindAttr を使用してボタンを無効にする

Question

ボタンを含むテンプレートがあります。

<button {{action clearAll}} >Clear All</button>

テンプレートのコントローラーはArrayController. ArrayController の content プロパティにアイテムが含まれていない場合、ボタンを無効にしたいと思います。

Answer 1

The answer is to use computed properties. Computed properties allow you to make a calculation based on Controller state rather than a raw boolean property (essentially creating a getter backed by multiple properties or a property of a different type).

In order for this function to fire bindings correctly, you need to declare which properties the function depends on - which properties should cause an update if they are modified. You do this using : `.property('content.length')'. In this case the function depends on a single property, but it could depend on more than one.

In the template:

<button {{action clearAll}} {{bindAttr disabled="anyEntries"}}>Clear All</button>

In the controller:

  anyEntries: function() {
    return this.get('content.length') == 0;
  }.property('content.length')