I want to try use:
{{#each content as |product index|}}
{{index}}
{{/each}}
But my app has the itemContoller, like this:
{{#each product in content itemController='product'}}
If I set this:
{{#each content as |product index| itemController='product'}}
It doesn't work! I found all of the ember guides and did not find the answer.
Any help please.
Controllers (Object, Array and itemController) are going away. The new way to do things is by using a component.
So, instead of your item controller, you would define a component:
App.MyProductComponent = Ember.Component.extend({
myIndex: function(){
return this.get('passedIndex') + 1;
}.property('passedIndex')
});
Then, inside your #each helper you would use it as follows:
<script type="text/x-handlebars" data-template-name="index">
<ul>
{{#each model as |product index|}}
{{ my-product passedIndex=index product=product }}
{{/each}}
</ul>
</script>
Working solution here
See the following link and do a search for itemController - https://github.com/emberjs/rfcs/pull/15
Really? I mean, there are many cases where I think creating a component for displaying computed values based on the property(s) of the controller's model would be overkill..... What if I just want a string (I don't need the <div> thing added by ember for each component).
Creating helper(s) then? Wow.
@user3443096,
If you wouldn't like to have div tags inserted by ember use tagName: "" property like this:
App.InvoiceItemsComponent = Ember.Component.extend({
tagName: ''
});
Now, divs around your component will not be inserted.
