Question

我尝试使用交替的行颜色设置表格。我无法让Meteor让我使用#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">，但是当它看到结束标记时会抛出错误。关于如何解决这个问题的任何建议？

Answer 1

问题是您只包含{{#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

Answer 2

我会像这样更改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()});
        },
 })

Meteor - 使用{{#if}}设置表行时的奇怪行为

2 个答案: