我试图在ember中的each中的最后一项下显示一段标记--我尝试了类似于@last的内容--但返回了一个错误
<ul> {{#each people as |person index|}} <li>Hello, {{person.name}}! You're number {{index}} in line</li> {{/each}} </ul>
sauutmhj1#
Ember的{{each}}模板帮助器没有提供一种简单的方法来实现这一点。你可能已经知道了,你可以使用{{unless index}}来有条件地渲染第一个对象上的内容,这是有效的,因为index从零开始,0被认为是错误的。你可以将ember-truth-helpers和ember-math-helpers结合起来,为最后一个元素实现类似的效果。这两个都是维护良好的ember插件,提供了一整套模板助手。Ember-truth-helpers提供了一个eq帮助器,它增加了对模板中相等比较的支持。Ember-math-helpers提供了一个sub帮助器,用于从模板中的另一个值中减去一个值。将两者结合起来,我们可以构建一个条件,它只对最后一个元素为真:
{{each}}
{{unless index}}
0
ember-truth-helpers
ember-math-helpers
eq
sub
{{#each items as |item index|}} <li> {{item}} {{#unless index}}(first){{/unless}} {{#if (eq index (sub items.length 1))}}(last){{/if}} </li> {{/each}}
你可以在这里找到一个演示方法的ember旋转:https://ember-twiddle.com/6ea05a2e9c884bd772eefabc91173d08?openFiles=templates.application.hbs%2C如果数组是一个Ember.NativeArray,那就更简单了。ember的NativeArray提供了一个lastObject property,它指向数组中的最后一项。你可以直接用这个来进行相等比较,正如@Gaurav在一条注解中指出的:{{#if (eq item items.lastObject)}}(last){{/if}}但请注意,如果数组有重复的元素,则可能会给予错误的结果。
Ember.NativeArray
NativeArray
lastObject
{{#if (eq item items.lastObject)}}(last){{/if}}
1条答案
按热度按时间sauutmhj1#
Ember的
{{each}}
模板帮助器没有提供一种简单的方法来实现这一点。你可能已经知道了,你可以使用
{{unless index}}
来有条件地渲染第一个对象上的内容,这是有效的,因为index从零开始,0
被认为是错误的。你可以将
ember-truth-helpers
和ember-math-helpers
结合起来,为最后一个元素实现类似的效果。这两个都是维护良好的ember插件,提供了一整套模板助手。Ember-truth-helpers提供了一个
eq
帮助器,它增加了对模板中相等比较的支持。Ember-math-helpers提供了一个sub
帮助器,用于从模板中的另一个值中减去一个值。将两者结合起来,我们可以构建一个条件,它只对最后一个元素为真:你可以在这里找到一个演示方法的ember旋转:https://ember-twiddle.com/6ea05a2e9c884bd772eefabc91173d08?openFiles=templates.application.hbs%2C
如果数组是一个
Ember.NativeArray
,那就更简单了。ember的NativeArray
提供了一个lastObject
property,它指向数组中的最后一项。你可以直接用这个来进行相等比较,正如@Gaurav在一条注解中指出的:{{#if (eq item items.lastObject)}}(last){{/if}}
但请注意,如果数组有重复的元素,则可能会给予错误的结果。