使用ember-cli,我使用了一些从api加载的把手。我在Handlebars模板中使用变量,但现在让render
,bind-attr
和custom-helper
工作会很好。
// app/helpers/view-helper.js
var ViewTemplateHelper = Ember.Handlebars.makeBoundHelper(function(template, context) {
if (Ember.isEmpty(template)) {
return;
}
else if (Ember.isArray(template)) {
template = template.get('firstObject.value');
}
else {
template = template.get('value');
}
context = context || this;
var dummy = Ember.View.extend({
classNames: ['view-template'],
context: context,
template: Ember.Handlebars.compile(template)
});
var view = dummy.create();
var $elem = null;
Ember.run(function() {
$elem = $('<div>');
view.appendTo($elem);
});
return new Ember.Handlebars.SafeString($elem.html());
});
export default ViewTemplateHelper;
只需像这样调用帮助器
// app/templates/blog-list.hbs
{{view-template blog}}
当我使用此Handlebar时,此代码可以正常运行
<h1>{{blog.title}}</h1>
但在使用render
,bind-attr
,custom-helper
,
{{render 'blog/cover' blog.image}}
控制台记录错误:
Uncaught TypeError: Cannot read property 'container' of null
有没有人知道如何在从api加载的Handleb中使用自定义助手?
答案 0 :(得分:0)
解决方案是使用此代码
options.hash.content = template;
return Ember.Handlebars.helpers.view.call(this, view, options);
完整助手
var ViewTemplateHelper = Ember.Handlebars.makeBoundHelper(function(template, options) {
if (Ember.isEmpty(template)) {
return;
}
else if (Ember.isArray(template)) {
template = template.get('firstObject.value');
}
else {
template = template.get('value');
}
var dummy = Ember.View.extend({
classNames: ['view-template'],
template: Ember.Handlebars.compile(template)
});
var view = dummy.create();
options.hash.content = template;
return Ember.Handlebars.helpers.view.call(this, view, options);
});
export default ViewTemplateHelper;