1. AngularJS 过滤器可以使用一个管道字符（|）添加到表达式和指令中。
2. AngularJS 过滤器：
| 过滤器 | 描述 |
| currency | 格式化数字为货币格式。 |
| filter | 从数组项中选择一个子集。 |
| lowercase | 格式化字符串为小写。 |
| orderBy | 根据某个表达式排列数组。 |
| uppercase | 格式化字符串为大写。 |
3. 表达式中添加过滤器：添加的过滤器是uppercase，使字符串格式化为大写。
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript" src="js/angular.min.js"></script> </head> <body> <div ng-app="myApp" ng-controller="myCtrl"><!--AngularJS应用程序由ng-app定义，在这个div内运行--> 姓名：{{xingMing() | uppercase}} </div> <script type="text/javascript" src="js/xingMing.js"></script> </body> </html>
var app = angular.module("myApp", []); app.controller(‘myCtrl‘, function($scope) { /*myCtrl是一个JavaScript函数*/ $scope.xing = ‘wang‘; $scope.ming = ‘ganlin‘; $scope.xingMing = function() { return $scope.xing + $scope.ming; }; });
4. 向指令添加过滤器和过滤输入：orderBy过滤器根据表达式排序数组，filter过滤器从数组中选择一个子集
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript" src="js/angular.min.js"></script> </head> <body> <div ng-app="myApp" ng-controller="myCtrl"><!--AngularJS应用程序由ng-app定义，在这个div内运行--> <input type="text" ng-model="test" /> <ul> <li ng-repeat="x in students | filter:test | orderBy:‘class‘"> {{x.name + ", " +x.class}} </li> </ul> </div> <script type="text/javascript" src="js/xingMing.js"></script> </body> </html>
var app = angular.module("myApp", []); app.controller(‘myCtrl‘, function($scope) { /*myCtrl是一个JavaScript函数*/ $scope.students = [ {name:‘hong‘,class:‘class2‘}, {name:‘fang‘,class:‘class3‘}, {name:‘ming‘,class:‘class1‘} ]; });
原文：http://www.cnblogs.com/wgl1995/p/6264106.html