Shakur Shakur - 4 months ago 36
AngularJS Question

Angularjs groupBy + orderBy

I am using groupBy from angular-filter to group an array of objects by their date property.

<div ng-repeat="(day, dayEvents) in events | groupBy: 'date' )">
<h3>{{ day | date: mediumDate }}</h3>
</div>


Which produces the following:

Feb 9, 2015
Feb 10, 2015
Feb 11, 2015
Feb 12, 2015


How can I reverse the order to start from the most recent date?
When I print to the console the array is printed with the order I want:

Object {
1423699200000: Array[1],
1423612800000: Array[7],
1423526400000: Array[11],
1423440000000: Array[1]
}


I also wrote a custom filter to reverse the order after the groupBy:

.filter("reverseOrder", function() {
function sortNumber(a,b) {
return parseInt(b) - parseInt(a);
}
return function(collection) {
var keys = Object.keys(collection).sort(sortNumber);
var reveredCollection= {};
var length=collection.length;
angular.forEach(keys, function(key) {
reveredCollection[key] = collection[key];
});
return reveredCollection;
}
})


Which I have applied like this:

<div ng-repeat="(day, dayEvents) in events | groupBy: 'date' | reverseOrder )">
<h3>{{ day | date: mediumDate }}</h3>
</div>

Answer

Recently had the same issue. groupBy creates an object, but the orderBy needs an array, so there's a little bit of funkiness involved. I ended up getting the answer straight from their issues page where one of the authors does an excellent job of explaining it complete with code samples that was basically copy/paste for me.

https://github.com/a8m/angular-filter/issues/57#issuecomment-65041792

Comments