How to sort many to many through a join model data

Ember Data
1

I have opened a question in stackoverflow you can find here.

I have two models with a many to many relationship through a join model because I need to store some relationship attributes in the association table.

The models are:

App.Module = DS.Model.extend({
   name: DS.attr('string'),
   ...
   modulesCourses: DS.hasMany('moduleCourse', { async: true })
});

App.Course = DS.Model.extend({
    name: DS.attr('string'),
    ...
    modulesCourses: DS.hasMany('moduleCourse', { async: true })
});

App.ModuleCourse = DS.Model.extend({
    character: DS.attr('string'),
    enabled: DS.attr('boolean'),
    module: DS.belongsTo('module', { async: true }),
    course: DS.belongsTo('course', { async: true })
});

When I get a module I can see its courses and the relation properties through the modulesCourses like this:

{{#each moduleCourse in module.modulesCourses}}
    Course: {{moduleCourse.course.name}} Character: {{moduleCourse.character}}
{{/each}}

But I need to sort the courses by name before displaying them. As the relations are defined as async: true the courses are fetched asynchronously so I think I should wait to have them all before trying to sort them.

Here I’m totally lost. I have tried some solutions but I can’t get them sorted. Here there is an example: http://emberjs.jsbin.com/vugeqi/4/edit

Have you got any idea? Thanks!

2

I’d use a computed property in this case. I’ve already answered your question over on StackOverflow, but am including the relevant code here as well in case this ends up higher in search results at some point:

App.ModuleController = Ember.ObjectController.extend({
  uname: function() {
    return this.get('name').toUpperCase();
  }.property('name'),

  moduleCoursesSorting: ['course.name'],

  sortedModulesCourses: Em.computed.sort('modulesCourses', 'moduleCoursesSorting')

});

JSBin can be viewed [here][1].

Hope that helps! [1]: JS Bin - Collaborative JavaScript Debugging

2 Likes
3

Perfect!

As I say in StackOverflow the sortBy not working made me try another solutions that were complex and wrong because any of them worked. On the other hand, this code is nice, clean and works like a charm.

Thanks a lot!