Más contenido relacionado Fun with Ember 2.x Features10. RENDER A CHILD VIEW
SOMEWHERE ELSE IN THE
DOM.
- yapplabs
EMBER WORMHOLE
18. {{#each users as |user|}}
{{yield user}}
{{/each}}
{{#user-list users=users as |user|}}
{{user-card user=user}}
{{/user-list}}
USER-LIST.HBS
USERS.HBS
20. {{#if showModal}}
{{#ember-wormhole to='fullscreen-modal-container'}}
<div class='modal-contents'>
<h1>You sure??</h1>
<div class='buttons-container'>
<button
{{action 'cancel'}}
class='btn large cancel'>Nevermind</button>
<button
{{action 'confirm'}}
class='btn large confirm primary'>Do it!</button>
</div>
</div>
{{/ember-wormhole}}
{{/if}}
{{yield (action 'showModal')}}
21. export default Ember.Component.extend({
showModal: false,
confirmPromise: null,
actions: {
showModal() {
const deferredPromise = Ember.RSVP.defer();
this.setProperties({
'showModal': true,
'confirmPromise': deferredPromise,
});
return deferredPromise.promise;
},
confirm() {
const deferredPromise = this.get('confirmPromise');
if (deferredPromise) {
deferredPromise.resolve();
}
this.setProperties({
22. confirm() {
const deferredPromise = this.get('confirmPromise');
if (deferredPromise) {
deferredPromise.resolve();
}
this.setProperties({
'showModal': false,
'confirmPromise': null,
});
},
cancel() {
const deferredPromise = this.get('confirmPromise');
if (deferredPromise) {
deferredPromise.reject();
}
this.setProperties({
'showModal': false,
'confirmPromise': null,
});