本文將簡單介紹AngularJS中的filter組件,即AngularJS的過濾器。
在正文之前,先來回顧一下ng中的一些基本概念:
module
,代碼的組織單元,其它東西都是在具體的模塊中定義的app
,業(yè)務(wù)概念,可能會用到多個模塊service
,僅在數(shù)據(jù)層面實現(xiàn)特定業(yè)務(wù)功能的代碼封裝controller
,與DOM結(jié)構(gòu)相關(guān)聯(lián)的東西,既是一種業(yè)務(wù)封裝概念,又體現(xiàn)了項目組織的層級結(jié)構(gòu)filter
,改變輸入數(shù)據(jù)的一種機制directive
,與DOM結(jié)構(gòu)相關(guān)聯(lián)的、特定功能的封裝形式過濾器Filter
的自定義是最簡單的,就是一個函數(shù),接受輸入,然后返回結(jié)果。在考慮過濾器時,我覺得很重要的一點:無狀態(tài)。
具體來說,過濾器就是一個函數(shù),函數(shù)的本質(zhì)含義就是確定的輸入一定得到確定的輸出。雖然filter
是定義在module
當中的,而且filter
又是在controller
的DOM范圍內(nèi)使用的,但是,它和具體的module
,controller
,$scope
這些概念都沒有關(guān)系(雖然在這里你可以使用js的閉包機制玩些花樣),它僅僅是一個函數(shù),而已。換句話說,它沒有任何上下文關(guān)聯(lián)的能力。
下面是一個簡單點例子:
var app = angular.module('Demo', [], angular.noop);
app.filter('map', function(){
var filter = function(input){
return input + '...';
};
return filter;
});
當有多個參數(shù)時,html中使用:
來分割,形如:data|map2:province:city
更多建議: