Recommended way to show loop counter

What’s the preferred way to show loop counter/index with the each helper?

I’ve seen {{_view.contentIndex}}, but to me it looks very hacky since this private _view might change in any time, plus it’s zero-based only.

I guess I can implement view inside my each helper and do the computed property like:

counter: function(){
  this.get('_parentView.contentIndex') + 1;
}.property();

Am I going the right direction? Also is there way to implement computed property logic in ArrayController?

You should just be able to use {{@index}} helper to get the current index.

I’ve read it from handlebars doc & tried that before, but it just doesn’t seem to work. On what version are able to use this? Here’s my jsbin proving it doesn’t work http://jsbin.com/UFOCoBEb/1/edit

You’re right sorry. I forgot that its not as simple as it looks.

Check this link out Each {{#each}} with index - #9 by jflim

1 Like