Here is an official guide explaining how to bind a boolean property to the disabled attribute of an HTML element. However, it references a controller in the process.
I have a button that, when clicked, transitions the route (it must be a button and not a link-to):
Located in /templates/trails.hbs
<button type="button" class="btn btn-primary" disabled={{isEditing}}
onclick={{route-action 'addNew'}}>Add New</button>
(The route-action helper enables me to use closure actions in routes)
Located in /routes/trails.js
import Ember from 'ember';
export default Ember.Route.extend({
actions: {
addNew() {
this.transitionTo('trails.new');
}
}
});
After clicking the button, the route is changed to 'trails.new'
Located in /routes/trails/new.js
import Ember from 'ember';
export default Ember.Route.extend({
isEditing: true,
});
Despite my expectations, this property seems to be ignored and not bound as intended. I even tried adding a controller:
Located in /controllers/trails/new.js
import Ember from 'ember';
export default Ember.Controller.extend({
isEditing: true,
});
Why does the official guide suggest something that doesn't seem to work as expected? What aspect of Ember am I overlooking here?