5.5 Filtros desde JavaScript

Hemos visto hasta ahora como usar los filtros desde la página HTML pero también se puede usar un filtro directamente desde JavaScript y de esa forma obtener el valor formateado en una variable de JavaScript.

Su uso es muy sencillo ya que es realmente un servicio de AngularJS llamado $filter. Este servicio es una función a la que le pasamos el nombre del filtro y nos retorna la función real de nuestro filtro. Aunque parece un poco trabalenguas ahora con un ejemplo se entenderá perfectamente.

Veamos un ejemplo del filtro currency .

var app=angular.module("app",[]);
  
app.controller("PruebaController",['$scope','$filter',function($scope,$filter) {

  var filtroCurrency=$filter("currency");

  $scope.importeFormateado=filtroCurrency(2.5231);

}]);

• Línea 3: Inyectamos el servicio $filter.
• Línea 5: Le pedimos al servicio $filter que nos de el filtro llamado currency. Ahora la variable filtroCurrency contiene la verdadera función que hace de filtro y que podemos usar donde queramos.
• Línea 7: Ahora es cuando usamos el filtro , y le pasamos como primer parámetro el valor a filtrar.

Al ejecutar el ejemplo la propiedad importeFormateado tendrá el valor “2,52 €” como un String.

Si queremos usar un filtro que tenga argumentos ,como por ejemplo el filtro date , simplemente se pasarán como segundo argumento.

var app=angular.module("app",[]);
  
app.controller("PruebaController",['$scope','$filter',function($scope,$filter) {

  var filtroDate=$filter("date");
  
  $scope.fechaFormateada=filtroDate(new Date(),"fullDate");


}]);

• Línea 5: Le pedimos al servicio $filter que nos de el filtro date.
• Línea 7: Ahora usamos el filtro , pasando como primer argumento la fecha a formatear y como segundo argumento el formato de fecha.

  $scope.fechaFormateada=$filter("date")(new Date(),"fullDate");
  $scope.importeFormateado=$filter("currency")(2.5231);