Is it possible to iterate over a computed array in Emberjs?

Question

I am trying to iterate over a computed array of properties in handlebars. In this example, I can do this for a regular array, but not for a computed array: http://jsfiddle.net/gh7Qr/

What should be the correct syntax for looping through a computed property in descriptors?

Answer 1

Yes it is possible. But you forgot to return your computed array, and you need to add cacheable() to the computed properties that return an object, not a primitive. Otherwise, you will come across an infinite loop (see Discussion https://github.com/emberjs/ember.js/issues/38 ) Also look at Gordon Hempton's excellent blog post about current Ember.js gotchas, including regarding computed properties. However, after fixing 626d23f , the caching problem was resolved.

A fixed example of your code is here: http://jsfiddle.net/gh7Qr/4/

Steering wheels:

 <script type="text/x-handlebars" > {{#each App.games}} {{this}} {{/each}} {{#each App.gamesA}} {{this}} {{/each}} </script> 

JavaScript:

 App = Ember.Application.create({ games: [1, 2, 3], gamesA: Em.computed(function() { return this.get('games').map(function(game) { return game + 'a'; }) }).property('games').cacheable() });​