带有 Backbone 和下划线的 JST
JST with Backbone and Underscore
我正在使用 Backbone 和 Underscore 创建一个小型测试站点。
我正在按照建议将所有 html 模板文件编译成一个 JST javascript 文件 here and here。
然而,如何将其与模板文件一起使用并不是很明显。我试过这个:
App.HeaderView = Backbone.View.extend({
el: '#headerContent',
template: JST['header.html'](),
//template: window["JST"]["header.html"],
//template: _.template("<h1>Some text</h1>"),
initialize: function () {
this.render();
},
render: function() {
//var html = this.template();
//// Append the result to the view's element.
//$(this.el).append(html);
this.$el.html(this.template());
return this; // enable chained calls
}
});
我得到的错误是 JST.header.html 不是函数。
(最后注释掉的位顺便说一下 template: _.template("<h1>Some text</h1>")
所以我知道问题不在于其他任何东西)。
可能是因为我用的是browserify(所以试过'requiring'这个文件),但是我试过几种不同的'including'模板文件的方式,包括直接添加:
<script src="templates/_templates.js"></script>
<script src="js/functions.js"></script>
</body>
</html>
知道需要做些什么才能让它发挥作用吗?
在第 3 行你不想调用模板,而只是使用:
template: JST['header.html']
。
目前您正在将模板设置为等于函数的 return 值,然后尝试调用该 return 值而不是实际函数,因此它引发了 "is not a function" 错误。
我正在使用 Backbone 和 Underscore 创建一个小型测试站点。
我正在按照建议将所有 html 模板文件编译成一个 JST javascript 文件 here and here。
然而,如何将其与模板文件一起使用并不是很明显。我试过这个:
App.HeaderView = Backbone.View.extend({
el: '#headerContent',
template: JST['header.html'](),
//template: window["JST"]["header.html"],
//template: _.template("<h1>Some text</h1>"),
initialize: function () {
this.render();
},
render: function() {
//var html = this.template();
//// Append the result to the view's element.
//$(this.el).append(html);
this.$el.html(this.template());
return this; // enable chained calls
}
});
我得到的错误是 JST.header.html 不是函数。
(最后注释掉的位顺便说一下 template: _.template("<h1>Some text</h1>")
所以我知道问题不在于其他任何东西)。
可能是因为我用的是browserify(所以试过'requiring'这个文件),但是我试过几种不同的'including'模板文件的方式,包括直接添加:
<script src="templates/_templates.js"></script>
<script src="js/functions.js"></script>
</body>
</html>
知道需要做些什么才能让它发挥作用吗?
在第 3 行你不想调用模板,而只是使用:
template: JST['header.html']
。
目前您正在将模板设置为等于函数的 return 值,然后尝试调用该 return 值而不是实际函数,因此它引发了 "is not a function" 错误。