Ember sort an enumerable array or add an new object to a regular array

Question

I have a todo list.
The main template has an input for entering new todos and an outlet.
The outlet is for the todos.index template which displays each todo. I have made them srtable using jquery sortable. I sort them using a model property.

todos route:

 model: function(){
        return this.store.filter("todo", {}, function(todo){
            if(todo.get("user") !== null && parseInt(todo.get("user").get("id")) === user_id)
                return todo;
        });

todos index route:

model: function(){
    return this.modelFor('todos').sortBy('idx');
}

controllers:

App.TodosController = Ember.ArrayController.extend();    

App.TodosIndexController = Ember.ObjectController.extend();

But when I add this .sortBy() method my returning array of objects is no longer live and any new todos i create arent added to the template. (they do get created and are in ember data and in my db, but they just arent being added to the template) - When you do sortBy the live array of ember data gets copied into an immmutable regular array.
If I leave out the sortBy() my new objects populate my template just fine.

any ideas of how to sort an array but keep it enumerble or how to refresh the template?

sortProperties is not working - I dont know why. My list of todos is populated by the objectController.

EDIT -

My problem was my own fault. I thought I had this

 App.TodosIndexController= Ember.ObjectController.extend();

But what I actually had was:

 App.TodoController = Ember.ObjectController.extend();

This left me without an explicit controller to do the sorting for me, so for me the solution was to create a new arrayController:

 App.TodosIndexController= Ember.ObjectController.extend();

and use that to do the sorting. Though it wasnt the solution to my problem, my issue was my own obliviousness, it is the right way to sort items so I am going to mark @Kingpins answer as correct.

Kingpin2k · Accepted Answer · 2014-06-12 15:40:44Z

1

Make your controller sorted, and iterate over the controller (not the model) in your template.

App.TodosIndexController = Ember.ArrayController.extend({
  sortProperties: ['idx'],
  sortAscending: true
});

return your model to just the modelFor

model: function(){
    return this.modelFor('todos');
}

Or you could create a computed property on the controller and watch the model for updates, updating the computed property

App.TodosIndexController = Ember.ArrayController.extend({
  sortedTodos: function(){
    return this.get('model').sortBy('idx');
  }.('model.[]')
});

and again, return your model to just the modelFor

model: function(){
    return this.modelFor('todos');
}

The other way to manually update the template, is to just get the model for TodosIndexController and manually use pushObject to add the new todos to it. It's just an array of items.

answered Jun 12, 2014 at 15:40

Kingpin2k

47.4k10 gold badges80 silver badges97 bronze badges

Sign up to request clarification or add additional context in comments.

7 Comments

Craicerjack Over a year ago

Dont have access to code right now, will later and will give a try but for option one - this isnt working. sortProperties isnt sorting. I think looking at it now I wasnt too clear about what i have. I think it might be the way i have model set up. There is a TodosController which is an ArrayController and the TodosIndexController which is an object controller. Route for the arraycontroller gets models and filters by userid etc, and then objectController route is the modelsFor('todos') which is the (parent) arrayController. The models are loading in the index template

Craicerjack Over a year ago

and then this template is inserted into the todos template. But I think because they are already loaded in the index template that the sortProperties in the arrayController has no affect.

Craicerjack Over a year ago

The second option looks promising though and ill give it a try later - ive also had the idea that i should make the call for the models in the Index route and then sortProperties might work in the objectController. Dont know if thats all clear or not but... Thanks I appreciate the suggestions

Kingpin2k Over a year ago

Yes, I'm fairly lost. sortProperties only will work on array controllers, and sortBy should only work on a collection/array. I'm not sure if I understood why you were using an object controller (isn't the data a collection?)

Craicerjack Over a year ago

Yeah so Im using Ember-cli and the naming conventions and the way I went about this confused me. The solution was something obvious. I didnt have a TodosIndexController. I thought I did and that it was the Object controller but I didnt, what I had was a TodosController and a TodoController So once I created that I was able to use sortProperties

|

Collectives™ on Stack Overflow

Ember sort an enumerable array or add an new object to a regular array

1 Answer 1

7 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

7 Comments

Your Answer

Sign up or log in

Post as a guest

Related