过滤器的本质就是一个方法，参数就是输入的值以及给过滤器指定的参数，返回值就是处理后要显示的值。
①过滤器创建
var app = angular.module();
app.filter(‘名称’，func)//创建过滤器
在filter的第二参数，是一个方法，返回的是过滤器方法（有返回值）
app.filter('customFilter', function () {
return function (value,arg1) {
console.log(value,arg1);
return '$'+value;
}
});
②调用过滤器（与自带过滤器用法一致）
{{ price | customFilter }}
效果：
代码：
<!DOCTYPE html> <html ng-app="myApp"> <head lang="en"> <meta charset="UTF-8"> <script src="js/angular.js"></script> <title></title> </head> <body> <div ng-controller="myCtrl"> <p>{{price}}</p> <p>{{price | customFilter:'￥'}}</p> </div> <script> var app = angular.module('myApp', ['ng']); //创建过滤器(过滤器的本质就是方法) app.filter('customFilter', function () { return function (value,arg1) { console.log(value,arg1); return '$'+value; } }); app.controller('myCtrl', function ($scope) { console.log('myCtrl func is called'); $scope.price = 100; }) </script> </body> </html>
2.自定义大写转换的过滤器
①创建过滤器
给过滤器定义方法
toUppercase()
②调用
效果：
代码：
<!DOCTYPE html> <html ng-app="myApp"> <head lang="en"> <meta charset="UTF-8"> <script src="js/angular.js"></script> <title></title> </head> <body> <div ng-controller="myCtrl"> <h1>{{name | myUppercase}}</h1> </div> <script> var app = angular.module('myApp', ['ng']); //创建自定义的过滤器 app.filter('myUppercase', function () { return function (value) { //实现对输入的处理 //返回，显示出来 return value.toUpperCase(); } }); app.controller('myCtrl', function ($scope) { $scope.name = "Jack"; }) </script> </body> </html>