我必须动态获取javascript文件,其中只包含车把助手功能。这将被提取到一个html文件,其中将包括模板。
动态文件(handle_helper_load.js):
import handlebars from 'handlebars';
handlebars.registerHelper('**fullName**', function(person) {
return person.firstName + " " + person.lastName;
})
Backbone.js 视图文件:
import handlebars from 'handlebars';
export default View.extend({
template: template,
onRender() {
var imported = document.createElement('script');
// This will load the above file in script tag on this page
imported.src = '**handlebar_helper_load.js**';
document.head.appendChild(imported);
// This is the handlebars template
var source = '<div class="post">\n' +
' <h1>By {{fullName author}}</h1>\n' +
' <div class="body">{{body}}</div>\n' +
'\n' +
' <h1>Comments</h1>\n' +
'\n' +
' {{#each comments}}\n' +
' <h2>By {{fullName author}}</h2>\n' +
' <div class="body">{{body}}</div>\n' +
' {{/each}}\n' +
'</div>\n';
var template = handlebars.compile(source);
var context = {
author: {firstName: "Alan", lastName: "Johnson"},
body: "I Love Handlebars",
comments: [{
author: {firstName: "Yehuda", lastName: "Katz"},
body: "Me too!"
}]
};
var html = template(context);
$.('handlebarDiv').append(html);
},
}
am面临的问题是,我得到一个错误,即函数**fullName**
没有定义,这意味着通过脚本标记注册帮助器不起作用。
有没有办法做到这一点?
1条答案
按热度按时间00jrzges1#
您可能需要
imported.src = 'handlebar_helper_load.js';
使用正确的路径(相对/完整)
而不是
imported.src = '**handlebar_helper_load.js**';
个因为当您附加script标签时,浏览器将请求该文件,而该文件应该存在于正确的路径中。请检查devtools中的网络选项卡,查看请求是否成功