詳解AngularJS中$filter過(guò)濾器使用(自定義過(guò)濾器)

* $filter 過(guò)濾器，是angularJs中用來(lái)處理數(shù)據(jù)以更好的方式展示給我用戶。比如格式化日期，轉(zhuǎn)換大小寫(xiě)等等。
* 過(guò)濾器即有內(nèi)置過(guò)濾器也支持自定義過(guò)濾器。內(nèi)置過(guò)濾器很多，可以百度。關(guān)鍵是如何使用：
* 1.在HTML中直接使用內(nèi)置過(guò)濾器
* 2.在js代碼中使用內(nèi)置過(guò)濾器
* 3.自定義過(guò)濾器
*
* （1）常用內(nèi)置過(guò)濾器
*    number 數(shù)字過(guò)濾器，可以設(shè)置保留數(shù)字小數(shù)點(diǎn)后幾位等
*    date  時(shí)間格式化過(guò)濾器，可自己設(shè)置時(shí)間格式
*    filter 過(guò)濾的數(shù)據(jù)一般是數(shù)組，數(shù)組中的數(shù)據(jù)可以是對(duì)象，字符串等
*    orderBy 排序根據(jù)數(shù)組中某一個(gè)元素的屬性排序等
*    lowercase 轉(zhuǎn)換小寫(xiě)
*    uppercase 轉(zhuǎn)換大寫(xiě)
*    limitTo  字符串剪切 使用格式{{被剪切的字符串|limitTo：數(shù)值}} 數(shù)值絕對(duì)值代表要切得字符個(gè)數(shù)，正代表從頭開(kāi)始切，負(fù)值相反。
*
* */

/*
* 定義格式：
* 模塊名稱.filter(‘過(guò)濾器名字'，function(){
*    return function(被過(guò)濾數(shù)據(jù)，條件1，條件2.。。。){
*    //過(guò)濾操作
*    }
* });
* */

myApp.filter("ChangeCode",function () {
  return function (inputData) {
    var changed = "";
    switch (inputData){
      case '101':changed = "老板";break;
      case '102':changed = "經(jīng)理";break;
      case '103':changed = "員工";break;
    }
    return changed;
  }
});
/*完成，說(shuō)一下使用場(chǎng)景（就這個(gè)過(guò)濾器的功能）和方式。
* 場(chǎng)景：服務(wù)器返回的數(shù)據(jù)中有個(gè)字段code，直接放標(biāo)簽里<div>{{data.code}}</div>,會(huì)顯示code值而不是code值對(duì)應(yīng)的職稱，這時(shí)候就可以用這個(gè)專(zhuān)門(mén)
*    針對(duì)這個(gè)轉(zhuǎn)換的自定義過(guò)濾器
* 使用方式：
*      （1）HTML中：<div>{{data.code | ChangeCode}}</div>//跟內(nèi)置過(guò)濾器一樣的方式
*      （2）js中：變量 = $filter("ChangeCode")(被過(guò)濾的code數(shù)據(jù))//一樣的調(diào)用方式
*      
* */

myApp.filter("deleteByAge",function () {
  return function (input,byAge,age) {
    var array = [];
    for(var i=0;i<input.length;i++){
      if(input[i][byAge]!=age){
        array.push(input[i]);
      }
    }
    return array;
  }
})
/*
* 處理一組數(shù)據(jù)的時(shí)候一般很少用在HTML當(dāng)中，帶條件的自定義過(guò)濾器是根據(jù)年齡值，也可以根據(jù)數(shù)組元素中的任意一個(gè)屬性值進(jìn)行刪除過(guò)濾。
* 使用方式：變量 = $filter("deleteByAge")(數(shù)組，“屬性名稱”，屬性值)；
* */

    model.filter(filterName，function(){
       return function(參數(shù)1，參數(shù)2，參數(shù)3.。。。。參數(shù)N){
         //過(guò)濾器處理部分
        }
      })