ember-receive
It's like a teleporter there and back again!
ember install ember-receive
There are many uses for ember-receive
, but one of the main uses is to unblock blocked components. Let me show you.
<!-- app/components/sidebar/template.hbs --> {{#some-component data=model as |result|}} <!-- You must use `result` here, or somehow pass it elsewhere ember-receive to the rescue! --> {{pass-to 'outside-area' result}}{{/some-component}}
In another place:
<!-- app/application/template.hbs --> {{#receive-for 'outside-area' as |result send|}} <!-- do something with result -->{{/receive-for}}
Check out the demo, npm start
and http://localhost:4200
.
Advanced
{{pass-to 'outside-area' (hash test=(component 'some-thing' name=name))}}
And consume:
{{#receive-for 'outside-area' as |ui send|}} <!-- everything inside will be rendered where the data came from --> {{#send.back}} {{#ui.test something=data}} Block data {{different-component}} {{/ui.test}} {{/send.back}}{{/receive-for}}
API
pass-to
- first parameter - Name of the source where the receiver can pick it up, this is required but doesn't have to be unique. String.
- second parameter - The data to pass to the source. This can be anything, primitive, object, array or a hash of contextual components.
blockTracking
- Prevent the receiver from sending back anything. Boolean, defaults tofalse
.
receive-for
- first parameter - Name of the source to reeive data from. Required.
- first yield - The data that is coming from the source.
- second yield - The send hash, which has one component at the moment:
back
- The teleport back to sender, used in block form and has no parameters/attributes. This will not send back if the sender has setblockTracking=true
.
Can also be used with an else
block:
{{#receive-for 'outer-rim' as |spaceships|}} <!-- spaceships here -->{{else}} Lightspeed is too slow{{/receive-for}}