關(guān)聯(lián)目錄索引：
重溫AngularJS（一）-- 表達(dá)式、指令
重溫AngularJS（二）-- 模型ng-model指令
重溫AngularJS（三）-- Scope(作用域)
重溫AngularJS（四）-- 控制器ng-controller
重溫AngularJS（五）-- 過濾器
重溫AngularJS（六）-- 服務(wù)Service
重溫AngularJS（七）-- Select(選擇框)、表格
重溫AngularJS（八）-- 事件
重溫AngularJS（九）-- 模塊、全局API
重溫AngularJS（十）-- 表單、輸入驗證
重溫AngularJS（十一）-- 包含、動畫
重溫AngularJS（十二）-- 依賴注入（5個核心組件）
重溫AngularJS（十三）-- 路由
作者：Zyao89；轉(zhuǎn)載請保留此行，謝謝；
過濾器可以使用一個管道字符 | 添加到表達(dá)式和指令中。
通過使用管道，可以便于雙向的數(shù)據(jù)綁定中視圖的展現(xiàn)。
過濾器在處理過程中，將數(shù)據(jù)變成新的格式，而且可以使用管道這種鏈?zhǔn)斤L(fēng)格，還能接受附加的參數(shù)。
AngularJS 過濾器
AngularJS 過濾器可用于轉(zhuǎn)換數(shù)據(jù)：
| 過濾器 | 描述 |
|---|---|
| currency | 格式化數(shù)字為貨幣格式。 |
| filter | 從數(shù)組項中選擇一個子集。 |
| lowercase | 格式化字符串為小寫。 |
| orderBy | 根據(jù)某個表達(dá)式排列數(shù)組。 |
| uppercase | 格式化字符串為大寫。 |
表達(dá)式中添加過濾器
過濾器可以通過一個管道字符 | 和一個過濾器添加到表達(dá)式中。
uppercase 過濾器將字符串格式化為大寫：
<div ng-app="myApp" ng-controller="personCtrl">
<p>姓名為 {{ lastName | uppercase }}</p>
</div>
lowercase 過濾器將字符串格式化為小寫：
<div ng-app="myApp" ng-controller="personCtrl">
<p>姓名為 {{ lastName | lowercase }}</p>
</div>
currency 過濾器
currency 過濾器將數(shù)字格式化為貨幣格式：
<div ng-app="myApp" ng-controller="costCtrl">
<input type="number" ng-model="quantity">
<input type="number" ng-model="price">
<p>總價 = {{ (quantity * price) | currency }}</p>
</div>
向指令添加過濾器
過濾器可以通過一個管道字符 | 和一個過濾器添加到指令中。
orderBy 過濾器根據(jù)表達(dá)式排列數(shù)組：
<div ng-app="myApp" ng-controller="namesCtrl">
<ul>
<li ng-repeat="x in names | orderBy:'country'">
{{ x.name + ', ' + x.country }}
</li>
</ul>
</div>
過濾輸入
輸入過濾器可以通過一個管道字符 | 和一個過濾器添加到指令中，該過濾器后跟一個冒號和一個模型名稱。
filter 過濾器從數(shù)組中選擇一個子集：
<div ng-app="myApp" ng-controller="namesCtrl">
<p><input type="text" ng-model="test"></p>
<ul>
<li ng-repeat="x in names | filter:test | orderBy:'country'">
{{ (x.name | uppercase) + ', ' + x.country }}
</li>
</ul>
</div>
根據(jù)input輸入的內(nèi)容，去過濾內(nèi)容
自定義過濾器
待增加...
