AngularJS Filters is array functions which can use like format number to currency, specific date format, a subset from an array etc.
-
currency Format a number to a currency format.
-
date Format a date to a specified format.
-
filter Select a subset of items from an array.
-
json Format an object to a JSON string.
-
limitTo Limits an array/string, into a specified number of elements/characters.
-
lowercase Format a string to lower case.
-
number Format a number to a string.
-
orderBy Orders an array by an expression.
-
uppercase Format a string to upper case.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 |
<!DOCTYPE html> <html> <script src="https://code.angularjs.org/1.6.9/angular.min.js"></script> <body> <div ng-app="myApp" > <div ng-controller="myCtrl" > <p>{{index | number}}</p> <p>{{today | date}}</p> <p>{{firstName | uppercase}} {{lastName | lowercase}}</p> <p>{{monthsList | json}} </p> <p>{{money | currency}}</p> <ul> <li ng-repeat="x in monthsList | orderBy:'month'"> {{ x.name + ', ' + x.month }} </li> </ul> <ul> <li ng-repeat="x in monthsList | filter:'mber'"> {{ x.name + ', ' + x.month }} </li> </ul> <ul> <li ng-repeat="x in monthsList | limitTo:5 "> {{ x.name + ', ' + x.month }} </li> </ul> </div> </div> <script> var app = angular.module("myApp", []); app.controller("myCtrl", function($scope) { $scope.index="9999999"; $scope.firstName="John"; $scope.lastName="Appleseed"; $scope.today="2018-04-16" $scope.money="15"; $scope.monthsList = [ {name:'February',month:'02'}, {name:'March',month:'03'}, {name:'December',month:'12'}, {name:'May',month:'05'}, {name:'January',month:'01'}, {name:'June',month:'06'}, {name:'October',month:'10'}, {name:'July',month:'07'}, {name:'August',month:'08'}, {name:'September',month:'09'}, {name:'April',month:'04'}, {name:'November',month:'11'}, ]; }); </script> </body> </html> |
More Stories
AngularJS Dynamic Routes
Angular Demo Project
AngularJS Routes