码迷,mamicode.com
首页 > 其他好文 > 详细

ng自定义一个过滤器

时间:2017-03-30 22:37:42      阅读:168      评论:0      收藏:0      [点我收藏+]

标签:head   mod   array   自定义指令   []   each   src   自定义   htm   

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自定义一个过滤器

标签:head   mod   array   自定义指令   []   each   src   自定义   htm   

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

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!