CODEWITHSUNDEEP
javascriptsortingember.jsember-data
myowz
myowz

Reputation: 121

Sorting a hasMany relationship without an ArrayController

I am trying to figure out the "Ember way" to do a sort when you don't have an array controller to rely on.

I created a jsbin to explain the situation, though I wasn't able to get it work on the jsbin (though it works in my project): http://emberjs.jsbin.com/mused/2/edit?html,js

FIX -- Thanks to kingpin, this jsbin is working: http://emberjs.jsbin.com/quyawitu/5/edit

Basically, say you have two models: "House" and "Window"

A house hasMany windows. A window belongsTo a house.

Now say you are in a template that looks like this:

<script type="text/x-handlebars" data-template-name="index">
  <ul>
    {{#each house in model}}
      <li>
        <div class="name">
          House name: {{house.name}}
        </div>
        <div>
          First Window: {{house.firstWindow}}
        </div>
      </li>
    {{/each}}
  </ul>
</script>

In this template, I am not interested in just linking to an association to windows -- instead, I am looking for the first window (specifically, the first window, sorted by createdAt).

Using the answer for this question, I used an ArrayProxy with the sortable mixin to create a computed property on my House model to get this reference. I am wondering if there is a more idiomatic "Ember way" to do this.

Upvotes: 1

Views: 64

Answers (1)

Kingpin2k
Kingpin2k

Reputation: 47367

upgrade ember and use the built in sortBy

In your particular case, since you've switched to the fixture adapter, those items are async, so I had to change a few of those things to make it work in your jsbin

  firstWindow: function(){
    return this.get('windowsByCreatedAt.firstObject');
  }.property('windowsByCreatedAt.firstObject'),

  windowsByCreatedAt: function() {
    var arr = [];
    this.get('windows').then(function(windows){
      arr.pushObjects(windows.sortBy('createdAt'));
    });
    return arr;
  }.property('[email protected]')
});

http://emberjs.jsbin.com/quyawitu/3/edit

Or if you want to watch the isLoaded and repopulate the computed property it looks a lot cleaner:

  windowsByCreatedAt: function() {
    return this.get('windows').sortBy('createdAt');
  }.property('[email protected]', 'windows.isLoaded')

http://emberjs.jsbin.com/quyawitu/6/edit

Upvotes: 1

Related Questions