A great feature of AngularJS is the ability to implement filters. Filters are a type of provider that hooks into the expression parser and modifies the results of the expression for display in a view—for example to format time or currency values.
You implement filters inside expressions, using the following syntax:
{{ expression | filter}}
If you chain multiple filters together, they are executed in the order in which you specify them:
{{ expression | filter | filter }}
Some filters allow you to provide input in the form of function parameters. You add these parameters by using the following syntax:
{{ expression | filter:parameter1:parameter2 }}
Also you can add filters, which are providers, to controllers and services by using dependency injection. The filter provider name is the name of the filter plus Filter
. For example, the currency filter provider is named currencyFilter
. The filter provider acts as a function, with the expression as the first parameter and any additional parameters after that. The following code defines a controller that injects currencyFilter
and uses it to format results. Notice that currencyFilter
is added to the dependency injection for the controller and is called as a function:
controller('myController', ['$scope', 'currencyFilter',
function($scope, currencyFilter){
$scope.getCurrencyValue = function(value){
return currencyFilter(value, "$USD");
};
}]);