Ember.js Handlebars block helper

1
votes

Apparently this does not work: http://jsbin.com/efapob/3/edit

Ember.Handlebars.registerHelper('foo', function(options) {
  var result = 'BEFORE '
           + options.fn(this)
           + ' AFTER';
  return new Handlebars.SafeString(result);
});

And I assume it's because the fn() writes directly to the output buffer.

However, I need a way to directly work with the output of the block's content.

I tried overwriting a view's render function, but that also didn't lead me anywhere.

(Background: I'm trying to write an {{#ifchanged}} helper block that only renders if the contents have changed in comparison to the last call. The use case is a loop that should display something every time one property of the model is different to the last one. If you have other ideas how to achieve this, comments very appreciated!)

2
ember.jshandlebars.js
Are you using ember-data? – Marcio Junior
Yes. Interesting, how could this be connected? – graup
Because you can use the isDirty property, to know when some property changes. Give a look in my answer. – Marcio Junior

2 Answers

1
votes

If anyone is interested, in this specific use-case I worked around the issue of not being able to use the return of fn() like so:

var ifchanged_last;
Ember.Handlebars.registerHelper('ifchanged', function(property, options) {
  var value = Ember.Handlebars.get(this, property);
  if (value !== ifchanged_last) {
    options.fn(this, options);
  }
  ifchanged_last = value;
  return;
});

Template:

{{#each content}}
  {{#ifchanged some_key}}
    The value changed
  {{/ifchanged}}
{{/each}}

Large room for improvement, but a usable starting point.

0
votes

You can use isDirty property from DS.Model to know when the data changes.

In some template:

{{#if isDirty}}
    You changed the model<br/>
{{/if}}

And a jsfiddle with the demo.