I'm instantiating a component and attaching some closure actions (new in Ember v1.13):
/app/templates/template.hbs
{{my-component key=val lookup=(action 'doLookup')}}
/app/templates/components/my-component.hbs
{{input value=coolField}}
<button {{action 'lookup' coolField}}>Look it up!</button>
/app/controllers/my-controller.js
export default Ember.Controller.extend({
actions: {
doLookup(field) {
// do some work…
}
}
});
I was under the impression that I wouldn't need to define an action on the component in this case to wire things up. But so far it looks like this is required:
/app/components/my-component.js
export default Ember.Component.extend({
actions: {
lookup(field) {
this.attrs.lookup(field);
}
}
});
Am I completely confused about how to use closure actions? It seems like wiring the action up in the component like this is just as much work as before (with regular actions).
I had exactly the same issue. Here's at least one way how closure actions can be used to avoid manually writing js code to forward actions.
/app/templates/template.hbs
{{my-component key=val lookup=(action 'doLookup')}}
/app/templates/components/my-component.hbs
{{input value=coolField}}
<button {{action (action 'lookup' coolField)}}>Look it up!</button>
/app/controllers/my-controller.js
export default Ember.Controller.extend({
actions: {
doLookup(field) {
console.log('Looking up with cool field value', field);
}
}
});
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