2014-09-30 49 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