Using bindAttr to disable a button if the ArrayController contains no Models in Ember
binding, ember.js, templates
Solution
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')
Problem
I have a template that contains a button: ``` <button {{action clearAll}} >Clear All</button> ``` The template's Controller is an `ArrayController`. I would like the button to be disabled if the ArrayController's content property contains zero items.