Emberjs在模板中递增

时间:2015-04-16 19:23:49

标签: ember.js handlebars.js increment helper grunt-ember-templates

我觉得我可能会为一个简单的问题做很多事情。

如果index = 0,我如何在模板中增加index

理想情况下,我想做这样的事情。

{{index+1}}

根据我的理解,解决方案是编写如下的辅助函数。

import Ember from 'ember';

export function plusOne(params) {
  return parseInt(params) + 1;
}

export default Ember.HTMLBars.makeBoundHelper(plusOne);

然后在模板中,您将执行以下操作。

{{plus-one index}}

所以希望,我错了,有一个更简单的方法来做到这一点。并且可能是在模板中进行“简单”处理的更简单方法。不确定是否存在异议,因为模板中可能存在“多少”逻辑。

对此的任何指导将不胜感激。

谢谢!

4 个答案:

答案 0 :(得分:6)

简短的回答是,不。模板中没有办法做任何真正的计算逻辑。帮助是在模板中为索引添加1的最佳选择。

当然,有人会想知道你为什么要为任何索引添加+1呢?可能以非零方式标记您的itterations?在这种情况下你不会渲染有序列表吗?

<ol>
  {{#each model as |foo|}}
    <li>{{foo.bar}}</li>
  {{/each}}
</ol>

导致:

  1. 我是个骗子
  2. 我也是个傻瓜!
  3. 我是个骗子!

  4. 另一种可能性是(作为对每个索引使用帮助器的替代方法)

    model: ['Foo', 'Man', 'Chu']
    
    foosWithCount: Ember.computed.map('model', function(foo, index) {
      return Ember.Object.create({
        name: foo,
        count: index + 1
      });
    });
    

    然后

    {{#each foosWithCount as |foo|}}
      <p>I'm {{foo.name}} and I'm #{{foo.count}}</p>
    {{/each}}
    

    导致:

    我是Foo而我是#1

    我是男人,我是#2

    我是楚,我是#3

答案 1 :(得分:3)

在学习Ember的同时,我也在努力解决这个问题。我已经创建了一个要点,向您展示如何使用非常简单的Handlebars辅助方法完成此操作。

https://gist.github.com/makabde/7d38d09d28b2a167b003

然后你所要做的就是用{{your-helper-method index}}调用这个助手;然后它应该输出索引增加1或你在辅助方法中设置的增量。

答案 2 :(得分:2)

如果您需要访问每个块中的索引,请使用:

<ul>
  {{#each model as |foo index|}}
   <li>{{index}} : {{foo.bar}}</li>
  {{/each}}
</ul>

请参阅:This Answer

然后,您可以使用模板助手从索引转换为位置。

JSBin Example

答案 3 :(得分:0)

我使用ember-composable-helpers inc hepler

{{#each model as |foo index|}}
  {{inc index}}
{{/each}}