Thursday, August 10, 2017

Angularjs $filter use in a controller

filter formats the value of an expression to be displayed to the user.
You can also use $filter in controllers, services, and directives. For this, inject a dependency with the name Filter to your controller/service/directive.

Step #1: Inject $filter to controller:

myApp.controller('NameController', function($scope, $filter) {

}

Step#2: Then wherever you want to use that filter, just use it like 

$filter('currency')

Step#3:If you want to pass arguments to that filter, do it using separate parentheses:

$filter('currency')(arg1arg2);

arg1 is the array you want to filter on and 
arg2 is the object used to filter.

Example: 
JavaScript:
var myApp = angular.module('myApp', []);
myApp.controller('NameController', function($scope, $filter) {
  $scope.Name = "Mohit";
  $scope.NameUpper = $filter('uppercase')($scope.Name);
  $scope.NameLower = $filter('lowercase')($scope.Name);
  $scope.Currency = $filter('currency')(100, "INR");
});

HTML:

<div ng-controller="NameController">
  <div>Name:{{Name}}</div>
  <div>Name in Upper:{{NameUpper}}</div>
  <div>Name in Lower:{{NameLower}}</div>
  <div>Currency:{{Currency}}</div>
</div>
Code available in https://jsfiddle.net/g2fLzy9L/

No comments:

Post a Comment