How do I sort my list of objects by an id array in angularjs?

Question

I'm trying to sort my list of arrays, but to no avail.

The problem: I have a list of objects however I need to sort it by an id string, which is inside an array.

JSON:

[{"id":2613,"name":"Aula 01","section":989},{"id":2614,"name":"Aula 02","section":989},{"id":2616,"name":"Aula 04","section":989},{"id":2617,"name":"Aula 05","section":989,},{"id":2615,"name":"3 - Aula 03","section":989}]

Array id sequence:

["2613", "2614", "2615", "2616", "2617"]

How to order ng-repeat or a loop in this array?

[Sorting an array of JavaScript objects](https://stackoverflow.com/questions/979256/sorting-an-array-of-javascript-objects) — adeneo, Aug 15 '17 at 14:12
Why is this question tagged with PHP if you're asking about angular? — M. Eriksson, Aug 15 '17 at 14:12
Are you asking about sorting the object array in the order of another array with the ids in the sort order? — Anthony, Aug 15 '17 at 14:13
If this is for showing on the page with ng-repeat, then you can use [orderBy](https://docs.angularjs.org/api/ng/filter/orderBy) — aynber, Aug 15 '17 at 14:13
Possible duplicate of [Sorting Angularjs ng-repeat by date](https://stackoverflow.com/questions/39471200/sorting-angularjs-ng-repeat-by-date) — Hitmands, Aug 15 '17 at 14:16

score 3 · Answer 1 · answered Aug 15 '17 at 14:13

You could sort like this a.id-b.id using js

var arr =[{"id":2613,"name":"Aula 01","section":989},{"id":2614,"name":"Aula 02","section":989},{"id":2616,"name":"Aula 04","section":989},{"id":2617,"name":"Aula 05","section":989,},{"id":2615,"name":"3 - Aula 03","section":989}]
var res = arr.sort((a,b)=> a.id-b.id)
console.log(res)

score 2 · Accepted Answer · answered Aug 15 '17 at 14:19

2

If you need an arbitrary order of the given id with the sequence array, you could use an object with the order for sorting.

array = [{ id: 2613, name: "Aula 01", section: 989 }, { id: 2614, name: "Aula 02", section: 989 }, { id: 2616, name: "Aula 04", section: 989 }, { id: 2617, name: "Aula 05", section: 989 }, { id: 2615, name: "3 - Aula 03", section: 989 }],
    sequence = ["2617", "2613", "2614", "2615", "2616"],
    order = {};

sequence.forEach(function (id, i) { order[id] = i + 1 });

array.sort(function (a, b) { return order[a.id] - order[b.id]; });

console.log(array);

.as-console-wrapper { max-height: 100% !important; top: 0; }

answered Aug 15 '17 at 14:19

Nina Scholz

376,160
25
347
392

I have the 2 arrays and the second one is the id sequence not necessarily in the order of the smallest to the largest! – Adriel Oliveira Aug 15 '17 at 14:31
I did not understand the css! If not help or comment – Adriel Oliveira Aug 15 '17 at 14:31
the sequence is in arbitrary order, like above, where the first id is greater then all following id, they are ascending, as example. the css is just to give you a greater console window on stackoverflow. – Nina Scholz Aug 15 '17 at 14:34

score 0 · Answer 3 · answered Aug 15 '17 at 14:15

0

Sorting with ng-repeat is really quite easy

<div data-ng-repeat="item in items | orderBy: 'id' ">

answered Aug 15 '17 at 14:15

aynber

22,380
8
50
63

@lealceldeiro, if that is really the question for. – Nina Scholz Aug 15 '17 at 14:21
1

@lealceldeiro It is not the order of the id and yes of the array with their sequence. – Adriel Oliveira Aug 15 '17 at 14:25
@NinaScholz, you are right. I misunderstood the question. Thanks, Adriel Olivera, for your clarification – lealceldeiro Aug 15 '17 at 14:42

Daniel Yefet · Answer 4 · 2017-08-15T14:34:35.540

You can use the the native sort method and use compare function, like this:

var json = [{"id":2613,"name":"Aula 01","section":989},{"id":2614,"name":"Aula 02","section":989},{"id":2616,"name":"Aula 04","section":989},{"id":2617,"name":"Aula 05","section":989,},{"id":2615,"name":"3 - Aula 03","section":989}];

var result = json.sort((a, b) => a.id - b.id)

console.log(result);

Assuming your JSON is coming from a service, it might look like this:

$scope.json = service.getJson().sort((a, b) => a.id - b.id);

Or maybe:

service.getJson().then(function (data) {

   $scope.json = data.sort((a, b) => a.id - b.id);
});

Then you can just ng-repeat it in the view.

score 0 · Answer 5 · answered Aug 15 '17 at 14:23

There's a couple ways to do this. 1. You could write a sorting function in your controller that sorts the return object after the api is called and put in a variable to reference in angular after it has been sorted. 2. You can use something like this: orderBy array item value in Angular ng-repeat on ng repeat.

How do I sort my list of objects by an id array in angularjs?

5 Answers5