我有一个手柄模板,但是我想在这个模板中包含来自两个不同来源的变量。
<script id="notification-menu-item" type="text/x-handlebars-template">我已经尝试让这两个源转到相同的模板id。这两个文件都有以下内容:
var source = $("#notification-menu-item").html();
var template = Handlebars.compile(source);但是只有一个源的变量通过模板。是否有一个模板从两个不同的来源获取它的{{variables}}?
编辑:代码
这是模板:
<script id="notification-menu-item" type="text/x-handlebars-template">
<div id="navmenucontainer" class="container">
<div id="navmenuv">
<ul class="nav">
<li>Topics</li>
<li>Help</li>
{{#if logged_user}}
<li>Notifications</li>
{{#if pro}}
<li>My Data</li>
{{/if}}
{{/if}}
</ul>
</div>
</div>
</script>pro来自一个.js文件,logged_user来自一个单独的.js文件。这两个变量是否都可以在同一个模板中使用?
发布于 2016-01-14 02:33:35
如果您想在将数据传递到Handlebars.compile()函数之前将数据组合起来,就必须将模板的呈现集中到一个函数中。我想您将不得不以某种方式保证这些“插件”js文件调用这个新函数的顺序。否则它会变成像这样的东西:
示例:
Class1.js
var source = $("#notification-menu-item").html();
var html = Notification.renderNotification(source, logged_user, undefined);
if (typeof html !== 'undefined') {
$('body').prepend(html);
}Class2.js
var source = $("#notification-menu-item").html();
var html = Notification.renderNotification(source, undefined, pro);
if (typeof html !== 'undefined') {
$('body').prepend(html);
}Notification.js
window.Notification = function() {
var logged_user = undefined;
var pro = undefined;
return {
renderNotification: function(source, user, isPro) {
if (typeof user !== 'undefined') {
logged_user = user;
}
if (typeof pro !== 'undefined') {
pro = isPro;
}
if(typeof logged_user !== 'undefined'
&& typeof pro !== 'undefined') {
var template = Handlebars.compile(source);
var html = template({logged_user: logged_user, pro: pro});
return html;
}
}
}显然,这是不优雅的,而且远不能维护。但是,我不知道具体的话语是如何运作的,我不知道该告诉你什么。在模板呈现时,应该传递一个包含所有相关数据的完整对象。随后对Handlebars.compile()的调用将需要完整的数据集。也许应该考虑找到一种方法将这些模板拆分并异步地呈现为单独的页面元素,或者查看部分数。
免责声明:我不是JS或无逻辑模板方面的专家。
https://stackoverflow.com/questions/34777201
复制相似问题