寫這個的目的是希望能學會如何在指令裡加入自己的過濾器。
1.關于過濾器你需要了解這些
1.過濾器的作用：
是将我們的現有的資料進行處理，比如重排序、轉換大小寫、計算等等，處理完了再傳回一個結果。
2.AngularJS自帶的過濾器：
| 過濾器 | 描述 |
|---|---|
| currency | 格式化數字為貨币格式。 |
| filter | 從數組項中選擇一個子集。 |
| lowercase | 格式化字元串為小寫。 |
| orderBy | 根據某個字段屬性重新排序。 |
| uppercase | 格式化字元串為大寫。 |
3.使用過濾器：
可在如下三個地方使用過濾器，在頁面上使用時，通過一個管道符（|）和過濾器名字，
<body>
<div ng-app="myApp" ng-controller="myCtrl">
<!-- 1.在表達式中使用過濾器 -->
<h1>{{"xywz" | uppercase}}</h1>
<!-- 2.在指令中使用過濾器 -->
<p ng-repeat="r in data |orderBy :'time'">{{r.result}}</p>
</div>
<script>
var app = angular.module('myApp', []);
//3.控制器中使用過濾器
app.controller('myCtrl', function($scope, $filter) {
$scope.data = [{'time':,'result':'賺錢了'},{'time':,'result':'虧大發了'}] ;
console.log($filter("orderBy")($scope.data,"time"));
});
</script>
</body>
2.如何寫自己的過濾器（關鍵）
我以一個将字元串折分成數組的過濾器舉例。在頁面上需要傳兩參數時，就在過濾器後面以冒号（:）隔開，如下面要傳的分割器；在頁面要實作傳三個及以上的參數時，我們可以通過在過濾器後面繼續加冒号（ :） 和參數的格式添加。總結就是，第一個參數是管道符号前面的資料，多個參數時，在過濾器名稱後面以冒号隔開。
<body>
<div ng-app="myApp" ng-controller="myCtrl">
<p ng-repeat="r in data | toArray">{{r}}</p>
<p ng-repeat="r in data2 | toArray:';'">{{r}}</p>
</div>
<script>
var app = angular.module('myApp', []);
//控制器
app.controller('myCtrl', function($scope, $filter) {
$scope.data ="abc,mn,大山,綠水";
$scope.data2 ="abc;mn;大山;綠水";//需要給定分割器
});
//将字元串分割成數組
app.filter("toArray",function(){
return function(data,separator){
if(data){
if(!separator) {
separator = ",";//預設逗号分割
}
return data.split(separator);
}else{
return [];//得到的結果類型始終為數組類型 }
}
});
</script>
</body>
3.過濾器中注入服務
<body>
<div ng-app="myApp">
在過濾器中使用服務:
<h1>{{255 | myFormat}}</h1>
</div>
<script>
var app = angular.module('myApp', []);
//自定義服務
app.service('hexafy', function() {
this.myFunc = function (x) {
return x.toString();
}
});
//過濾器
app.filter('myFormat',['hexafy', function(hexafy) {
return function(x) {
return hexafy.myFunc(x);
};
}]);
</script>
</body>
![粒子濾波流程[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)