ng自定义一个过滤器

Posted BD_evel

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了ng自定义一个过滤器相关的知识,希望对你有一定的参考价值。

ng允许我们自定义指令

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

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

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

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

  }

})

金典的例子:

demo:

<!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){
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":"大哥大"}


以上是关于ng自定义一个过滤器的主要内容,如果未能解决你的问题,请参考以下文章

ng 自定义过滤器的创建和使用

angularjs自定义过滤器

AngularJS-自定义过滤器 ng-repeat 求和

如何将自定义片段添加到 zen-coding?

嵌套 ng-repeat 的 AngularJS 记录计数

VSCode自定义代码片段——git命令操作一个完整流程