During dev I would like to refresh my handlebar templates if they are saved live.
I already have a websocket channel that notifies me when a file saves. At that point I can force a reload of the particular template by updating a hash on the script
tag src
.
How can I notify all the Views that use this template that they need refreshing and force a refresh?
(How can I find them? How do I trigger a refresh?)
note this works for simple templates, but not for ones that are rendered into outlets
Getting this going was rather tricky:
var js = "template.js";
var templateName = "template";
Ember.TEMPLATES["empty"] = Handlebars.compile("")
// script loaders are the simplest way of getting a callback
$LAB.script(js).wait(function(){
$.each(Ember.View.views,function(){
if(this.get('templateName')==templateName){
this.set('templateName','empty');
this.rerender();
this.set('templateName',templateName);
this.rerender();
}
});
})
In theory, you could do Ember.View.views.filterProperty('templateName', nameOfUpdatedTemplate).set('template', Ember.TEMPLATES[nameOfUpdatedTemplate])
. That should force a re-render.
I have not tried this, and don't know what edge cases you might run into, but that would be the simplest approach I can think of.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With