AngularJs filters are concepts that work with
separation of record based on column and in angular filters, we added
expressions and directives by using the pipe
(|) character.
The default order
is ascending.
This filter is use
to display the array items in the order way (the order may be ascending or
descending).
In the below
example, I am going to display an array items in UX using the OrderBy
ascending.
//The OrderBy syntax: <div ng-repeat="user in users | orderBy: 'age' "></div> //AngularJs code sample as given below. var app = angular.module("myApp", []); app.controller("MyCtrl", function ($scope) { $scope.users = [{ name: "Anil Singh", age: 30 }, { name: "Sunil", age: 20 }, { name: "Viru Da", age: 40 }, { name: "Aradhya", age: 1 }]; }); //HTML code sample as given below. <div ng-app="myApp"> <div ng-controller="MyCtrl"> <ul ng-repeat="user in users | orderBy: 'age' "> <li>{{user.name}}</li> </ul> </div> </div> //The full example code with live demo as given below. <!DOCTYPE html> <html> <head> <script src="https://code.angularjs.org/1.4.0-beta.6/angular.js"></script> <script> var app = angular.module("myApp", []); app.controller("MyCtrl", function ($scope) { $scope.users = [{ name: "Anil Singh", age: 30 }, { name: "Sunil", age: 20 }, { name: "Viru Da", age: 40 }, { name: "Aradhya", age: 1 }]; }); </script> </head> <body ng-app="myApp"> <div ng-controller="MyCtrl"> <ul ng-repeat="user in users | orderBy: 'age' "> <li>{{user.name}}</li> </ul> </div> </body> </html>
The output as below,
About Blogger
|
Hey! I am Anil Singh. I am Active Blogger, Writer and Programmer. I love learning new technologies, programming, blogging and participating the forum discussions more...
|
0 comments:
Post a Comment