我只是想知道是否有人在骨干项目中使用此插件的经验。
我没有将所有脚本模板标签放在一个索引文件中,而是希望将模板放在与我需要它们的视图相同的目录中。
所以我希望我可以使用node选项来要求本地模板并渲染它,然后附加到我的索引文件上的#id(我将整理laster)。
所以基本上我把我的把手模板(template.hbs)和它编译的js(template.js)放在我的骨干视图index.coffee上。
public
|_ coffee
|_views
|_card
|_list
index.coffee
template.hbs
template.js
作为参考,我的grunt文件如下所示:
handlebars: {
compile: {
options: {
namespace: 'MyApp.Templates',
node: true
},
files: {
"public/coffee/views/card/list/template.js": "public/coffee/views/card/list/template.hbs"
}
}
},
在我的骨干视图(index.coffee)中我希望像这样需要把手模板:
class CardList extends Backbone.View
template: require('./template')
…
do some other shiz
…
render: =>
template = Handlebars.compile($(this.template).html())
html = template
model: this.model
$(this.el).html(html)
渲染它会在检查器中吐出这个错误:
Uncaught [object Object]
> template = handlebars.compile($(this.template).html());
我显然不知道自己在做什么,所以我希望有人可以说明我如何正确使用这个插件。
我正在使用grunt-contrib-handlebars v0.3.5
感谢任何帮助。
由于
答案 0 :(得分:3)
您可以通过building the files object dynamically实现这一目标。
也许是这样的,虽然我不确定cwd
是否支持通配模式。我也不确定dest
是否与cwd
相关。如果情况并非如此,这将不起作用,但值得一试。
handlebars: {
dist: {
options: {
namespace: 'MyApp.Templates',
node: true
},
// Glob for a directory of files, builds the files object, then map each
// one to a new destination file.
expand: true,
cwd: './public/coffee/views/*',
src: '**/*.hbs',
dest: './',
ext: '.js'
}
},
答案 1 :(得分:2)
查看您所包含的template.js文件。 grunt-comtrib-handlbars应该已经将它预编译为Javascript函数,因此不再需要调用Handlebars.compile。您可以删除该模板= Handlebars.compile行。