Consider the following Ember component which is using Semantic UI:
import Ember from 'ember';
export default Ember.Component.extend({
classNames: ['ui', 'mini', 'modal'],
didInsertElement() {
this.$().modal({
onApprove: () => {
let promise = // obtain promise from parent... somehow
promise.then(() => {
this.$().modal('hide');
});
return false;
}
});
}
});
The modal dialog is initialized as soon as the element is accessible. The onApprove
option specifies a callback to be invoked when the user clicks "OK" in the dialog. The component's parent supplies an Ember.RSVP.Promise
, which when resolved, closes the dialog.
Herein lies the problem — how do I obtain the promise from the parent? I considered the following possibilities:
-
The parent could supply an action to be invoked:
However, actions cannot return values, so although the component could invoke the action, it could not use it to obtain the promise.
-
The parent could supply the promise as a bound property:
The problem with this approach is that
didInsertElement()
cannot obtain the promise itself since the component must wait for thepromise
property to mutate.
Is there a way for a component to ask the parent for a value in a synchronous manner?
Aucun commentaire:
Enregistrer un commentaire