2014-09-30 57 views
0

我试图用一个车把每个迭代器中的模板以下代码块:Hanlebars每个帮助上下文

<table> 
    <tr><th></th><th>Today</th><th>This Month<br>(To Date)</th><th>Last Month</th></tr> 
    {{#each Activities}} 
     {{examineObject this}} - first - 
     <tr><td>{{examineObject this}}</td> 
     <td>{{Today}}</td> 
     <td>{{ThisMonth}}</td> 
     <td>{{LastMonth}}</td></tr> 
     {{examineObject this}} - third - 
    {{/each}} 
    <tr class='total'><td>Net Change</td> 
     <td>{{Totals.Today}}</td> 
     <td>{{Totals.ThisMonth}}</td> 
     <td>{{Totals.LastMonth}}</td></tr> 
</table> 

examineObject是车把帮助我写简单地调用JSON.stringify()的变量。我正在做这个来评估上下文。帮手很简单:

examineObject: function(object){ 
    return JSON.stringify(object); 
} 

当我编译和渲染上面的模板时,发生了一些非常奇怪的事情。在第一个和第三个examineObject调用this的上下文是由迭代器each选择的个人activity。但是,this中的第二个examineObject调用(由html标记包围)的上下文是整个模板的上下文 - 而不是上下文中的个人activityeach迭代器选择。任何人都可以解释为什么这会是?

+0

请发布你的帮手的代码。 – gfullam 2014-09-30 14:25:36

+0

这对助手来说并不是问题,因为即使我不使用助手来测试,上下文也会混乱。不过,我发布了帮手。 – 2014-09-30 14:27:40

+0

这是你如何设置的?适用于我:http://jsfiddle.net/gfullam/5rbpja10/ – gfullam 2014-09-30 14:37:52

回答

1

请勿使用jQuery的.find()来获取您的handlebars模板,因为它将会抓取渲染的DOM,这可能与您写入的文件内容不同。

相反,尝试loading your template file asynchronously

更新:

或者,如果你有一个模板众多,不想跑了许多异步请求,如“Handling handlebars.js like a pro证明你可能感兴趣的precompiling the handlebars templates ”。

+1

我得到你来自哪里,但出于资源的目的,我宁愿不做10个或更多的异步调用每页加载拿起所有的模板。现在,我通过require.js保持最低限度的呼叫。我会进一步思考这个问题,以及是否还有其他不错的选择。 – 2014-09-30 15:31:01