內置過濾器
1、currency(貨幣處理)
currency可以將數字格式轉化為貨幣的形式,如果不傳參數,默認為$。
1 {{num|currency:"¥"}}
展現的形式為¥xxx。
2、date(日期格式化)
angular中提供的date過濾器能夠滿足一般的時間格式要求。
{{date|date:'y-m-d h:m:s EEEE'}}
展現形式為:年-月-日 時:分:秒 星期,它們之間的格式可以自由組合,脫離了原生js中的單調和復雜性。
3、filter(匹配字符串)
filter用來處理數組,然后可以挑選出含有的所選中的子串元素,作為子數組來返回。可以是字符串數組,也可以是對象數組。如果是對象數組,可以匹配屬性的值,它接受一個參數,來定義子串的規則。
1 $scope.arr = ["Monday","Tuesday","星期三","星期四","周五","周六"];
1 <li>{{arr|filter:'d'}}</li> 2 <li>{{arr|filter:'周'}}</li>
它能選出數組中含有字母“d”、含有漢子“周”的元素,然后分別以數組的形式返回。
4、json(格式化json對象)
json過濾器可以把一個js對象格式化為json字符串,沒有參數。這東西有什么用呢,官網說它 可以用來進行調試,嗯,是個不錯的選擇。或者,也可以用在js中使用,作用就和我們熟悉的JSON.stringify()一樣。
1 {{ jsonTest | json}}
5、limitTo(限制數組長度或字符串長度)
limitTo過濾器用來截取數組或者字符串的長度,接收一個參數用來指定要截取的數組或者字符串的長度,如果值為負數,那么就從數組或者字符串的尾部開始截取。
1 <li>{{arr|limitTo:'3'}}</li>
它會截取數組arr的前三位,然后以數組的形式返回。
6、lowercase(小寫格式)
把英文字母全部轉化成小寫的形式,也沒有太大的用處。沒有參數。
<li>{{da|lowercase}}</li>
這里只能轉換英文,遇到其他的則不轉換。
7、uppercase(大寫格式)
這個的寫法跟lowercase相同。
8、number(格式化數字)
number過濾器可以為一串數字進行分位,相當於千位分割符,如:123,456,789。可以接收一個參數,指定float類型保留幾位小數。
<li>{{num|number:2}}</li>
這個就表示保留小數點后兩位。
9、orderBy(排序)
orderBy過濾器可以將數組中的元素進行排序,接收一個參數指定排序的規則,參數可以是字符串,表示以這個屬性名稱進行排序;可以是一個函數,定義排序屬性;可以是一個數組,表示依次按數組的屬性值進行排序。
1 $scope.err = [ 2 {name : 'jack',age : 30}, 3 {name : 'mack',age : 24}, 4 {name : 'sunny',age : 28}, 5 {name : 'jim',age : 20}, 6 ]
1 <li>{{err|orderBy:'age':true}}</li>
這個就是以age的從大到小進行排序。
自定義過濾器
1 <div ng-controller = 'con'> 2 <div>{{msg|prz}}</div> 3 </div> 4 <script src="public/libs/angular/angular.min.js"></script> 5 <script> 6 var App = angular.module('App',[]); 7 App.controller('con',['$scope',function($scope){ 8 $scope.msg = 'you can kill'; 9 }]) 10 App.filter('prz',function(){ 11 return function(z){ 12 return z[0].toUpperCase()+z.slice(1); 13 } 14 }) 15 </script>
上面代碼表示,自定義一個首字母大寫的過濾器。