How can I make Ember trigger a controller action when the user presses the escape key in an input field?
Given the following application code:
App = Ember.Application.create();
App.IndexRoute = Ember.Route.extend({
model: function () {
return {foo: "bar"};
}
});
App.IndexController = Ember.ObjectController.extend({
actions: {
done: function () {
console.log("done");
},
cancel: function () {
console.log("cancel");
}
}
});
And the following HTML:
<body>
<script type="text/x-handlebars" data-template-name="application">
{{outlet}}
</script>
<script type="text/x-handlebars" data-template-name="index">
{{input value=foo action="done" cancel="cancel"}}
</script>
</body>
I would expect the cancel action in the controller to be triggered, but what I get is an error: Property 'cancel' of object [object Object] is not a function
.
Here's a JSBin with the above code to illustrate. How can I make this work?
It's not very documented, but seeing the code... https://github.com/emberjs/ember.js/blob/v1.1.2/packages/ember-handlebars/lib/controls/text_support.js#L106-L117
You should define you handlebars like this
{{input value=foo enter='done' escape-press='cancel'}}
JsBin http://jsbin.com/ObucELO/1/edit
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With