ember-component-inbound-actions
ember-component-inbound-actions copied to clipboard
Getting the return value of the action
I'm in a situation where I need to get the return value of a call to an action (in my case a Promise). Basically I'd like to call the action similar as how you'd call a closure action.
Now I have to resort to something hacky like:
const childComponent = this.get('childComponent').target;
return childComponent.actions.someAction.call(childComponent);
whereas ideally I'd do something like
return this.get('childComponent.someAction')();
Is this something that you've thought about extending the addon with? I know that Ember.ActionHandler
only exposes the send
function. I'm not too familiar with the part of Ember.js that implements closure actions but maybe there's a way we could easily mix in that functionality similar to Ember.ActionHandler
. Just wanted to get your opinion before I dive into this further :-).
It sounds like you could use contextual components and closure actions. Is there any reason why you couldn't? I'm interested as I suspect that this addon might not have any use cases that aren't covered by core Ember primitives
Maybe my use case will make it clearer. I want to delay the destroy of a component, for animation purposes. Ideally Ember would have a sort of an async willDestroyElement
, similar to how the model
hook in a route is blocking. Reality is different :-).
So I'm using ember-component-inbound-actions
to send an action willClose
to the child component, which returns a Promise. The parent component then waits until this Promise resolves to effectively destroy the child component.
Something like this:
component:parent-component
// components/parent-component/template.hbs
{{#if showChildComponent}}
{{child-component actionReceiver=childComponent}}
{{/if}}
// components/parent-component/component.js
...
hideChildComponent() {
const childComponent = this.get('childComponent').target;
childComponent.actions.willClose.call(childComponent).then(() => {
this.set('showChildComponent', false);
});
}
...
component:child-component
// components/child-component/component.js
...
actions: {
willClose() {
return this.someAsyncStuffThatReturnsAPromise();
}
}
...
It's hacky I agree but it's the easiest solution I could come up with.
So now the addon allows us to perform a send
on an action receiver. However, it doesn't give us the return value of the action. I hope this makes it a bit clearer?