Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
556 views
in Technique[技术] by (71.8m points)

handlebars.js - Positional index in Ember.js collections iteration

Is there a way to get positional index during iteration in ember.js?

{{#each itemsArray}}
     {{name}}
{{/each}}

I'm looking for a way to have something like:

{{#each itemsArray}}
    {{name}} - {{index}}th place.
{{/each}}

Update:

As per the comment by @ebryn the below code works without using a nested view for each item:

<script type="text/x-handlebars">    
    {{#collection contentBinding="App.peopleController"}}
        Index {{contentIndex}}: {{content.name}} <br />
    {{/collection}}
</script>?

http://jsfiddle.net/WSwna/14/

Although to have something like adjustedIndex, a nested view would be required.

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)

It's old question but still gets a lot of hits. In the current version of Ember.JS one can use _view.contentIndex to display current index inside the loop.

{{#each}}
    Index: {{_view.contentIndex}}
{{/each}}

If you need an adjusted index (for instance starting from 1) then there is a possibility of creating reusable helper increment

Ember.Handlebars.registerBoundHelper('increment', function(integer) {
    return integer + 1;
});

then you would use it in the following way

{{#each}}
    Index: {{increment _view.contentIndex}}
{{/each}}

Update

Starting with ember 1.11 you can do as well

{{#each people as |person index|}}
   Index: {{increment index}}
{{/each}}

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

2.1m questions

2.1m answers

60 comments

57.0k users

...