流星 - 使用{{#if}}設置表格行時出現奇怪的行爲

我想使用交替行顏色設置表格。我很難讓Meteor讓我使用#if語句來啓動每一行。流星 - 使用{{#if}}設置表格行時出現奇怪的行爲

這是確定行號是奇數還是偶數的簡單助手;

Template.drillDown.trx = function() { 
    return trx.find({userID: Meteor.userId()}); 
} 


Template.drillDown.isEven = function(num) { 
    return !(num & 1); 
}

我在名爲drillDown的模板中有這個;

<table> 
    {{#each trx}} 
     {{#if isEven trx_num}} 
      <tr class="even"> 
     {{else}} 
      <tr class="odd"> 
     {{/if}} 
      <td>{{trx_num}}</td> 
     </tr> 
    {{/each}} 
</table>

我得到了意外的錯誤{{else}}。我試着用其他方式設置其他方式，比如在<tr class="even">之類的整個標籤中，但是當它看到結束標籤時會引發錯誤。有關如何克服這個問題的建議？

來源

2014-11-04 Leoj Pyzynski

trx如何幫助呃看起來？ – Sindis 2014-11-04 16:51:50

我會在那裏添加它。 – 2014-11-04 16:52:22

問題是，你只是在{{#if}}塊中包裝開始標記。在Spacebars中，每件事都必須是一個具有開始和結束標記的完整元素。

來完成你在找什麼，最好的辦法是：

助手：

Template.drillDown.isEven = function() { 
    return !(this.trx_num & 1); 
}

HTML：

<tr class="{{#if isEven}}even{{else}}odd{{/if}}"> 
    <td>{{trx_num}}</td> 
</tr>

此外，您可以完全避免和使用這個事情的來龍去脈tr:nth-child(even)而不是偶數和奇數類：http://www.w3.org/Style/Examples/007/evenodd.en.html

來源

2014-11-04 17:15:18 stubailo

我把你的代碼放在那裏，它完美的工作。首先，我聽說過tr：n孩子（偶數），畢竟這些年來仍然在學習新的東西。謝謝！ – 2014-11-04 18:56:31

我會改變if助手這樣的：

Template.drillDown.isEven = function() { 
    return !(this.trx_num & 1); 
}

（我假設助手返回正確答案）然後，if語句可以是這樣的，因爲我想這行導致麻煩

{{#if isEven}}

另外，如果你有更多的幫手，更好的方法來管理它們，就是讓它們保持這種方式

Template.<template>.helpers({ 
     isEven: function() { 
      return !(this.trx_num & 1); 
     }, 
     trx: function() { 
      return trx.find({userID: Meteor.userId()}); 
     }, 
})

來源

2014-11-04 16:57:03 Sindis

謝謝你的提示，我會用它！ – 2014-11-04 18:49:29

流星 - 使用{{#if}}設置表格行時出現奇怪的行爲

回答

相關問題