डाउनलोड पी.डी.एफ. ई-बुक्स
AJS - Filters orderBy

orderBy ये filter; दिए गए array को sort करके array में return किया जाता है |

Syntax for orderBy Filter in AngularJS

{{expression | orderBy : expression : reverse}}

Parameter for orderBy Filter in AngularJS

expression : यहाँ पर expression दिया जाता है | इस expression से sorting order को निर्धारित किया जाता है |

reverse : Optional. अगर true दिया जाता है तो reverse sort किया जाता है | default value 'false' होती है | इसका मतलब ये ascending order में ये sort किया जाता है |


Example for orderBy Filter in AngularJS

Source Code :
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
</head>
<body>
<div ng-app="app" ng-controller="ctrl">

<b>Ascending by product : </b>{{appliances | orderBy : 'product'}}<br />
<b>Ascending by cost : </b>{{appliances | orderBy : 'cost'}}<br /><br />

<b>Descending by product : </b>{{appliances | orderBy : 'product' : true}}<br />
<b>Descending by cost : </b>{{appliances | orderBy : 'cost' : true}}<br />

</div>
<script>
var myapp = angular.module('app', []);
myapp.controller("ctrl", function ($scope){
$scope.appliances =
[
{product: 'TV', cost: '14000'},
{product : 'Refrigerator', cost: '11000'},
{product : 'Washing Machine', cost: '13000'},
{product : 'Watch', cost: '19000'},
{product : 'Laptop', cost: '21000'},
{product : 'AC', cost: '22000'}
]
});
</script>

</body>
</html>
Output :
Ascending by product : [{"product":"AC","cost":"22000"},{"product":"Laptop","cost":"21000"},{"product":"Refrigerator","cost":"11000"},{"product":"TV","cost":"14000"},{"product":"Washing Machine","cost":"13000"},{"product":"Watch","cost":"19000"}] Ascending by cost : [{"product":"Refrigerator","cost":"11000"},{"product":"Washing Machine","cost":"13000"},{"product":"TV","cost":"14000"},{"product":"Watch","cost":"19000"},{"product":"Laptop","cost":"21000"},{"product":"AC","cost":"22000"}]

Descending by product : [{"product":"Watch","cost":"19000"},{"product":"Washing Machine","cost":"13000"},{"product":"TV","cost":"14000"},{"product":"Refrigerator","cost":"11000"},{"product":"Laptop","cost":"21000"},{"product":"AC","cost":"22000"}] Descending by cost : [{"product":"AC","cost":"22000"},{"product":"Laptop","cost":"21000"},{"product":"Watch","cost":"19000"},{"product":"TV","cost":"14000"},{"product":"Washing Machine","cost":"13000"},{"product":"Refrigerator","cost":"11000"}]

Another Example for orderBy Filter in AngularJS

Source Code :
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
</head>
<body>
<div ng-app="app" ng-controller="ctrl">
<select ng-model="SortOrder">
<option value="+cost">Lowest First</option>
<option value="-cost">Highest First</option>
</select>
<ul ng-repeat="appliance in appliances | orderBy:SortOrder">
<li>Product Name : {{appliance.product}} | Product Cost : {{appliance.cost}}</li>
</ul>
</div>
<script>
var myapp = angular.module('app', []);
myapp.controller("ctrl", function ($scope){
$scope.appliances =
[
{product: 'TV', cost: '14000'},
{product : 'Refrigerator', cost: '11000'},
{product : 'Washing Machine', cost: '13000'},
{product : 'Watch', cost: '19000'},
{product : 'Laptop', cost: '21000'},
{product : 'AC', cost: '22000'}
]
});
</script>

</body>
</html>
Output :
  • Product Name : {{appliance.product}} | Product Cost : {{appliance.cost}}