javascript - 如何在 emberjs 的 handlebars foreach 循环中仅为第一个元素设置类

Question

我正在开发一个 emberjs 应用程序，它将根据我的模型动态创建 n 个按钮。为此，我在模板中使用 foreach 来遍历我的模型并为模型中的每个元素创建一个按钮。

{{#each model.zones as |zone|}}
       <li><a id="{{zone.zone_id}}" {{action 'setData' zone.currenttemp zone.setpoint zone.mode zone.zone_id on='click'}} class="zones">{{zone.zone_name}}: {{zone.currenttemp}}&deg;F</a></li>
{{/each}}

每个按钮都属于“区域”类，但我只希望第一个按钮在应用程序加载时成为“事件”类的一部分。我知道 emberjs handlebars 不支持 @first 运算符，所以我不确定该怎么做。

Answer 1

每个 block 都带有index 变量，您可以结合if 内联辅助函数

{{#each model.zones as |zone index|}}
       <li><a id="{{zone.zone_id}}" {{action 'setData' zone.currenttemp zone.setpoint zone.mode zone.zone_id on='click'}} class={{if index 'zones' 'active'}}>{{zone.zone_name}}: {{zone.currenttemp}}&deg;F</a></li>
{{/each}}

如果您想进行其他检查，则可以安装 ember-truth-helpers添加在。

class={{if (eq index 0) 'active' 'zones'}}