This code worked in ember 1.7.0:
var ViewTemplateHelper = Ember.Handlebars.makeBoundHelper(function(templateString, options) {
var dummy = Ember.View.extend({
classNames: ['view-template'],
template: Ember.Handlebars.compile(templateString)
});
var view = dummy.create();
if (options && options.hash) {
options.hash.content = template;
}
// Hack to prevent appendChild error
if (options.data.view._state === 'inDOM') {
options.data.view.rerender();
options.data.view.renderToBuffer();
}
return Ember.Handlebars.helpers.view.call(this, view, options); // undefined is not a function
});
export
default ViewTemplateHelper;
But now in ember 1.10.0 is gives the undefined is not a function
error.
I tried to use Ember.Handlebars.helpers.view.helperFunction.call
.
What do I miss?
The solution for this problem was not in a helper, but to use a component instead.
// components/content-element.js
import Ember from 'ember';
export
default Ember.Component.extend({
updateLayout: function() {
var store = this.container.lookup('store:main');
var projectId = this.get('project.id');
store.find('contentElement', {
key: this.get('key'),
project_id: projectId
}).then(function(contentElement) {
if (!Ember.isEmpty(contentElement.get('firstObject.value'))) {
var template = contentElement.get('firstObject.value');
var compiled = Ember.Handlebars.compile(template);
this.set('layout', compiled);
this.rerender();
}
}.bind(this));
}.observes('key').on('init')
});
We use the model contentElement
for our templates. After setting the layout to the compiled Handlebars you have to run this.rerender();
For components you have to bind all to be used variables like this:
{{content-element key="name.of.element" project=project}}
In this case we use project
in our dynamic template so we bound it. The key
is used to get the right contentElement
from the store.