The AngularJS $filter
service is used for formatting data displayed to the user. The $filter
service works with AngularJS built in filter like uppercase, lowercase, currency, orderby etc. It can be used with custom filter also.
Syntax
$filter('uppercase')($scope.name); $filter('currency')($scope.salary);
<!DOCTYPE html>
<html>
<head> <!-- www.techstrikers.com -->
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.1/angular.min.js"></script>
<meta charset="utf-8">
<title>AngularJS $filter Example</title>
<script>
var app = angular.module('app', []);
app.controller("FilterController", function ($scope,$filter) {
$scope.name = '';
$scope.salary = 0;
$scope.UppercaseFilter = function()
{
$scope.name = $filter('uppercase')($scope.name);
}
$scope.CurrencyFilter = function()
{
$scope.salary = $filter('currency')($scope.salary);
}
});
</script>
</head>
<body style="background-color:#DDE4E9;">
<fieldset style="background-color:#DDE4E9;">
<legend>AngulerJS $filter Service Example</legend>
<div ng-app="app">
<div ng-controller="FilterController">
Enter Name (in small):
<input type="string" ng-model="name">
<button ng-click="UppercaseFilter()">Uppercase Filter</button></br>
Enter Salary:
<input type="string" ng-model="salary">
<button ng-click="CurrencyFilter()">Currency Filter</button> </br>
</div>
</div>
</fieldset>
</body>
</html>