我正在创建一个自定义手柄助手,但在通过终端编译时总是抛出Object #<Object> has no method 'fn'
。
我的车把助手是:
module.exports.register = function (Handlebars, opts, params) {
Handlebars.registerHelper('compimg', function (context, opts) {
var compImg = ["assets/img/icon-nope.png","assets/img/icon-check.png"];
return compImg[opts.fn(context)];
});
}
我的.hbs文件是:
{{#each checkable}}
<div class="col-md-3 col-xs-3 icon-container"><img src="{{compimg this}}"></div>
{{/each}}
我的JSON文件是:
{
"desc": "blablabla",
"checkable": [
1,
1,
1,
1
]
}
当我查看官方文档时,我发现了这段代码。有人可以解释一下context
和options
究竟是什么吗?
Handlebars.registerHelper('each', function(context, options) {
var ret = "";
for(var i=0, j=context.length; i<j; i++) {
ret = ret + options.fn(context[i]);
}
return ret;
});
答案 0 :(得分:6)
each
的把手示例是一个块助手,这意味着{{#each}}
和{{/each}}
标记之间有更多标记或模板语法。使用此语法时,Handlebars会将options
参数作为最后一个参数传递给助手。 options
对象包含fn
方法,其工作方式与编译模板类似... var html = options.fn(context);
为您提供块内的渲染模板。
context
变量是你传递给你的助手的东西,如果你想要更多,可以是任意数量的参数。
既然您正在制作内联帮助器而不是块帮助器,我认为您只需要更改一行......
return compImg[opts.fn(context)];
到
return compImg[context];