Angular orderby multiple fields

Angular orderby multiple fields | orderBy:['-age', 'name']

Use orderBy filter to do this: orderBy:['-age','name']

Syntax:
<div ng-repeat="user in users | orderBy:['-age', 'name']">
    <div></div>
</div>

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:['-age,name]:true but that seems less clear than just making status descending as shown earlier.

Let see the example in details:-

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Example - Angularjs orderby multiple fields</title>
    <link href="style.css" rel="stylesheet" type="text/css">
    <script src="//code.angularjs.org/snapshot/angular.min.js"></script>
    <script>angular.module('orderByExap', [])
  .controller('CtrlExamp', ['$scope', function($scope) {
    $scope.users = [
      {name: 'Anil',   phone: '9015519972',  age: 34},
      {name: 'Sunil',   phone: '9015519971',  age: 30},
      {name: 'Sushil',   phone: '9015519975',  age: 21},
      {name: 'Aradhya',   phone: '9015519978',  age: 5},
      {name: 'Reena',  phone: '9015519979',  age: 29}
    ];
  }]);</script>
</head>
<body ng-app="orderByExap">
    <div ng-controller="CtrlExamp">
        <table class="friends">
            <tr>
                <th>Name</th>
                <th>Age</th>
                <th>Phone</th>
            </tr>
            <tr ng-repeat="user in users | orderBy:['-age', 'name']">
                <td>{{user.name}}</td>
                <td>{{user.age}}</td>
                <td>{{user.phone}}</td>
            </tr>
        </table>
    </div>
</body>
</html>

Result looks like –

ANIL SINGH

Anil Singh is an author, tech blogger, and software programmer. Book writing, tech blogging is something do extra and Anil love doing it. For more detail, kindly refer to this link..

My Tech Blog - https://www.code-sample.com/
My Books - Book 1 and Book 2

Angular orderby multiple fields | orderBy:['-age', 'name'] Angular orderby multiple fields | orderBy:['-age', 'name'] Reviewed by Anil Singh on 4:24 AM Rating: (5)
www.code-sample.com/. Powered by Blogger.
^