CODEWITHSUNDEEP
ember.jshandlebars.js
blueFast
blueFast

Reputation: 44381

Dynamic nature of templates broken by custom handlebars helper

I have this helper function:

// You can insert directly html from a controller, by doing:
//   {{rawHtml formattedName}}
//   where formattedName is the name of the controller property returning the html
Handlebars.registerHelper('rawHtml', function(propName) {
    var html = this.get(propName);
    if(typeof html === 'undefined') {
        console.error('rawHtml > propName=%s can not be found. Using empty string for html', propName);
        html = '';
    }
    return new Handlebars.SafeString(html);
});

Which I use this way in my template:

<td>{{#link-to controller.showRoute this}}{{rawHtml formattedName}}{{/link-to}}</td>

formattedName is a computed property:

SettingsApp.GenericModel = DS.Model.extend({

    'properties§name' : DS.attr('string'),

    formattedName: function () {
        var formattedName = this.get('properties§name') || SettingsApp.helpers.markText(config.lang.UNDEFINED_NAME, 'UNDEF');
        return formattedName;
    }.property('properties§name'),

    ...

});

This is working fine. But there is a problem: whenever the data in the store changes while the template is being displayed (no route change), the template does not update. In my application this happens whenever data is being pushed by the server (websockets) or whenever I trigger a manual / automatic store update (for testing) without changing routes.

I have narrowed the problem to the rawHtml helper: if I do the following:

<td>{{#link-to controller.showRoute this}}{{formattedName}}{{/link-to}}</td>

the template gets updated all-right. So, the store is working fine and the computed property is working fine.

I would like to know where is the problem in the rawHtml helper? What kind of update chain is it breaking? How can I fix it so that it does not break the dynamic nature of templates?

EDIT

According to the guide:

If the name property on the current context changes, Ember.js will automatically execute the helper again and update the DOM with the new value.

But it does not seem to be the case: formattedName changes, but the helper is not called. What am I doing wrong?

Upvotes: 0

Views: 113

Answers (1)

Steve H.
Steve H.

Reputation: 6947

According to the docs (http://emberjs.com/api/classes/Ember.Handlebars.html#method_registerBoundHelper) you should be using Ember.Handlebars.registerBoundHelper to get this data binding. registerHelper by default is unbound.

Upvotes: 2

Related Questions