angularJS自定义一个过滤器

ng允许我们自定义指令

下面来我们自己来定义一个过滤指令:filter,返回一个函数的形式

filter(name,callback(){//name:过滤器的名字,callback:匿名函数

  return function(collection,keynames){//collection:该指令前面的对象,keynames:用于过滤的关键字

    /........................./

  }

})

1.金典的例子

<!doctype html>
<html lang="en" ng-app="myApp">
 <head>
  <script src="angular.js"></script>
 </head>
 <body  ng-controller="myCtrl">
      <div ng-repeat="item in array_object | unique:'name'">
         {{item}}
      </div>
 </body>
</html>
<script>
 angular.module("myApp",[])
 .controller("myCtrl",["$scope",function(s){
   s.array_object=[{"name":"明哥哥"},{"name":"小林黛玉"},{"name":"大哥大"},{"name":"小林黛玉"}];
   s.Two_Fish="fdsdf";
     s.change=function(){
       console.log(s.Two_Fish);

     }
 }])
.filter("unique",function(){
   return function(collection,keynames){//collection->array_object、keynames->name,分别对应过滤器两边的条件
      var output=[];//存储,过滤之后的对象
      var keys=[];//用于对比过滤
      angular.forEach(collection,function(item){
         var key=item[keynames];
          if(keys.indexOf(key)===-1){
           keys.push(key);
           output.push(item); 
          }

      });
       console.log(output);
      return output;
   }
});
</script>

结果很迷人:
{"name":"明哥哥"}

{"name":"小林黛玉"}

{"name":"大哥大"}

2.如果要进行多个参数进行过滤:

<span  ng-bind="d[h.key] | numFormat:h.adSrhType:camb"></span>
  // 数字的千分符转换
    .filter('numFormat',[function(){
        return function numToThousands (n,valType,camb) {
            if (valType === 'number' && n!== undefined && n!==null && n.toString().length > 0){ 
                n = n.toString();
                var re = /d{1,3}(?=(d{3})+$)/g;
                n = n.replace(/^(d+)((.d+)?)$/, function (s, s1, s2) { return s1.replace(re, '$&,') + s2;});
            } 
            return n;
        };  
    }])

  

 
  
原文地址:https://www.cnblogs.com/evaling/p/eval_ing.html