lundi 13 avril 2015

Ember.js: How to observe whether template DOM element has been rendered

I have a controller which loads asynchronous data into the Ember main store.

While it's loading, it displays a loading spinner. After it's done loading it displays the data.


My problem is that I would also like to inject jQuery logic/bindings once the data has been loaded and the template rendered.


The question is: what hooks get called when templates get rendered/updated?


I tried observing when the data is loaded, but it doesn't reliably inject the jQuery after the template is rendered (see below):


controllers/index.js



export default Ember.Controller.extend({
listReady: function() {
Ember.run.next(this, function() {
// jQuery logic
})

}.observes('model.stations.content.isLoaded'),
})


routes/index.js



export default Ember.Route.extend({
setupController: function(controller, model) {
var that = this;
controller.set('content', {
stations: that.store.find('station'),
others: that.store.find('other')
});
}
});


templates/index.js



{{#if model.stations.content.isLoaded}}
{{!--display the data--}}
{{else}}
{{!--display a loading spinner--}}
{{/if}}




Aucun commentaire:

Enregistrer un commentaire