CODEWITHSUNDEEP
ember.jshandlebars.js
h--n
h--n

Reputation: 6023

Ember Handlebars helper view not updated

I'm trying to use Handlebars helper, but the helper view does not get updated.

The view,

<script type="text/x-handlebars">
  {{#view App.NumberView}}
    <button {{action changeNumber}}>Change number</button><br>
    {{formatNumber view.number}} <br>
    {{view.number}}
  {{/view}}
</script>​

The code,

App = Ember.Application.create({});

App.NumberView = Ember.View.extend({
  number: 5,
  changeNumber: function(e) {
    this.set('number', this.get('number') + 1);
  }    
});

Em.Handlebars.registerHelper('formatNumber', function(timePath, options) {
  var number = Em.Handlebars.getPath(this, timePath, options);
  return new Handlebars.SafeString("Formated number: " + number);
});

​ The live example in jsfiddle http://jsfiddle.net/LP7Hz/1/

So what's wrong ?

Upvotes: 2

Views: 1738

Answers (2)

secretlm
secretlm

Reputation: 2361

Because Handlebars helpers in Ember which aren't bound helpers. So you can instantiate an auxiliary view to do that like this fiddle:

http://jsfiddle.net/secretlm/qfNJw/2/

HTML:

<script type="text/x-handlebars">
    {{#view App.NumberView}}
        <button {{action changeNumber}}>Change number</button><br>
        {{formatNumber view.number}} <br>
        {{view.number}}
    {{/view}}
</script>​

Javascript:

App = Ember.Application.create({});

App.NumberView = Ember.View.extend({
    number: 5,
    changeNumber: function(e) {
        this.set('number', this.get('number') + 1);
    }    
});


App.registerViewHelper = function(name, view) {
  Ember.Handlebars.registerHelper(name, function(property, options) {
    options.hash.contentBinding = property;
    return Ember.Handlebars.helpers.view.call(this, view, options);
  });
};


inlineFormatter = function(fn) {
  return Ember.View.extend({
    tagName: 'span',

    template: Ember.Handlebars.compile('{{view.formattedContent}}'),

    formattedContent: (function() {
      if (this.get('content') != null) {
        return fn(this.get('content'));
      }
    }).property('content')
  });
};


App.registerViewHelper('formatNumber', inlineFormatter(function(content) {

    return new Handlebars.SafeString("Formated number: " + content);
}));

This link is useful: http://techblog.fundinggates.com/blog/2012/08/ember-handlebars-helpers-bound-and-unbound/ from @Jo Liss ​

Upvotes: 3

Trek Glowacki
Trek Glowacki

Reputation: 3621

You're looking for a bound helper, which doesn't exist just yet. There is a Pull Request and associated discussion.

Upvotes: 1

Related Questions