ember.js - some help on Em.Route#send? -
i trying implement router events , using send function of router trigger events on router. couldn't documentation on this.
trying implement raising event controller/view data server. , events asynchronously fetches data server , when data has been fetched wanted initialize child view of view called event i.e. need know when data has been fetched. don't think events on router returns such can know when call has been over.
like:
view:
em.view.extend({ click: function(){ var recordspromise = this.get('controller.target').send('getrecords'); recordspromise.done(this.initiateprotocol); }, showchild: false, initiateprotocol: function(){ //this showchild used condition in template show/hide // childview. , being set after call completed // //here childoneview present other js file , fetched using requirejs require(['childoneview'], $.proxy(function(childoneview){ this.set('childone', childoneview.extend({ templatename: 'childone' }); this.set('showchild', true); }, this)); } }
router
em.route.extend({ events: { getrecords: function(){ //make ajax call fetch records , return ajax // promise } } });
template
{{#if view.showchild}} {{view view.childone}} {{/if}}
i think idiomatic ember approach bit different. send action controller , let bubble route, , set properties view respond via bindings:
view
app.recordsview = em.view.extend(ember.viewtargetactionsupport, { click: function(){ this.triggeraction({action: 'getrecords'}) } });
controller
app.recordscontroller = em.arraycontroller.extend({ content: [], isloaded: false });
template
<!-- records.handlebars --> {{#if isloaded}} render stuff here... perhaps {{#each this}}{{somerecordproperty}}{{/each}} {{/if}}
router
app.recordsroute = em.route.extend({ events: { getrecords: function(){ var controller = this.controllerfor('records'); $.ajax(...).then(function(data){ em.run(function(){ controller.setproperties({ content: data.foo, isloaded: true }); }); }); } } });
Comments
Post a Comment