orderBy two fields (one in reverse)

Problem

I would like to order a friend list by status (online firsts, offline lasts) and by alphabetical order. All I manage to get is:

  • Online firsts / Reversed alphabetical order
  • Or offline firsts / Alphabetical order

Here is plunker to expose my problem

Problem courtesy of: JMaylin

Solution

Change the orderBy filter to this:

orderBy:['-status','name']

This will order by descending status (by prefixing the - character), then ascending name. Currently you're passing true to reverse the sort, which is causing the status to be correct (online first), but the names to be reversed (i.e., descending).

If you want to keep the reverse boolean, you could use orderBy:['status','-name']:true but that seems less clear than just making status descending as shown earlier.

Solution courtesy of: Ahmad Mageed

Discussion

In Angular 1.5.8 previous example does not work. Different logic has to be applied.

It looks logic from previous orderBy is applied to the next one, so in order to sort name ASC and status DESC name order has to be reveresed:

<li class="friend" ng-repeat="friend in friends | orderBy:'name':true | orderBy:'status':true">

Here is fixed example: http://plnkr.co/edit/0ZFIftSgNkU9F03xJztG?p=preview

Discussion courtesy of: nemanjabu

There is another option to do that, you can have multiple orderBy filter in ng-repeat and that line :

<li class="friend" ng-repeat="friend in friends | orderBy:['status','name']:true">

will be :

<li class="friend" ng-repeat="friend in friends | orderBy:'name':false | orderBy:'status':true">

The last orderBy is execute first and the second to last etc ...

Here is my plunkr : http://plnkr.co/edit/girPFzdi3Zx0yp0ASGVQ?p=preview

Discussion courtesy of: Allenile

This recipe can be found in it's original form on Stack Over Flow.