Question

I’m storing a list of search terms in my ArrayController. I’d like the search terms to be displayed newest to oldest. By default Ember outputs them in order.

You can see my current implementation here: http://andymatthews.net/code/emberTweets/

And here’s the pertinent code.

{{#each App.recentUsersArray.reverse}}
    <li>
        <a href="#" title="view again" {{action "searchAgain" target="App.recentUsersArray"}}>{{this}}</a>
    </li>
{{/each}}

App.recentUsersArray = Em.ArrayController.create({
    content: [],
    reverse: function(){
        return this.content.reverse();
    }.property(),
});

You can see that I’m trying to reverse it using a property() method but it’s not working. Am I doing something wrong?

Answer 1

You should always use get and set to access properties. Also if a computed property depends on other ones, you have to add these in the property declaration. The use of cacheable can be omitted in the next release of ember, see discussion. You can see a working example here.

reverse: function(){
    return this.get('content').toArray().reverse();
}.property('content.@each').cacheable()

You could also use the unshiftObject method on an array and hereby circumvent creating a computed property, see http://jsfiddle.net/ez7bV/.