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;

        };

    }])

　　

 
  

ng自定义一个过滤器的更多相关文章

  1. vue自定义一个过滤器

    vue如何自定义一个过滤器 html代码: <div id="app"> <input type="text" v-model="m ...

  2. angularJS自定义一个过滤器

    ng允许我们自定义指令 下面来我们自己来定义一个过滤指令:filter,返回一个函数的形式 filter(name,callback(){//name:过滤器的名字,callback:匿名函数 ret ...

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

    过滤器的本质就是一个方法,参数就是输入的值以及给过滤器指定的参数,返回值就是处理后要显示的值. ①过滤器创建var app = angular.module();app.filter(‘名称’,fun ...

  4. 实现MVC自定义过滤器，自定义Area过滤器，自定义Controller，Action甚至是ViewData过滤器

    MVC开发中几种以AOP方式实现的Filters是非常好用的,默认情况下,我们通过App_Start中的FilterConfig来实现的过滤器注册是全局的,也就是整个应用程序都会使用的,针对单独的Fi ...

  5. 自定义jinja2 过滤器

    今天,我们要讲的是自定义jinja2 过滤器这个知识点,因为官方文档对此一代而过,讲得不够清楚,所以我们专门拿出来讲一下. 例子 例子写了两个自定义过滤器,一个是转换字典到字符串的过滤器,一个是返回当 ...

  6. MVC自定义过滤器，自定义Area过滤器，自定义Controller，Action甚至是ViewData过滤器

    实现MVC自定义过滤器,自定义Area过滤器,自定义Controller,Action甚至是ViewData过滤器 MVC开发中几种以AOP方式实现的Filters是非常好用的,默认情况下,我们通过A ...

  7. [C#].Net Core下全局自定义身份过滤器使用AllowAnonymous属性

    假设一种情况:项目中需要做认证和权限控制,而且需要权限才能访问的控制器要远多于可以匿名访问的(类似AO系统那样,登陆了才能用). 那在每个控制器上加一个 [Authorize] 是能解决问题,反正正我 ...

  8. ASP.NET Core中使用自定义MVC过滤器属性的依赖注入

    除了将自己的中间件添加到ASP.NET MVC Core应用程序管道之外,您还可以使用自定义MVC过滤器属性来控制响应,并有选择地将它们应用于整个控制器或控制器操作. ASP.NET Core中常用的 ...

  9. django -使用jinja2模板引擎 自定义的过滤器

    setting.py中 TEMPLATES = [ { 'BACKEND': 'django.template.backends.jinja2.Jinja2', 'DIRS': [os.path.jo ...

随机推荐

  1. Dijkstra算法——单源最短路径问题

    学习一个点到其余各个顶点的最短路径--单源最短路径 Dijkstra算法是由荷兰计算机科学家狄克斯特拉于1959 年提出的,因此又叫狄克斯特拉算法.是从一个顶点到其余各顶点的最短路径算法,解决的是有向 ...

  2. 初探Lambda表达式/Java多核编程【4】Lambda变量捕获

    这周开学,上了两天感觉课好多,学校现在还停水,宿舍网络也还没通,简直爆炸,感觉能静下心看书的时间越来越少了...寒假还有些看过书之后的存货,现在写一点发出来.加上假期两个月左右都过去了书才看了1/7都 ...

  3. Google addword 策略

    https://support.google.com/adwords/answer/1704392?hl=zh-Hans&authuser=0 顾客会用自己的思路去解决生意上的问题,想要拥有自 ...

  4. 微软.NET年芳15：我在Azure上搭建Photon服务器(C#.NET)

    网上火热的“微软.NET年芳15”文章,我也得写点什么嘛,毕竟我还是现任的微软MVP. 摘录网上的“.NET 15周年”信息如下: 微软的 .NET 框架本周迎来了 15 岁生日..NET 的第一个版 ...

  5. 【Java基础】HashMap工作原理

    HashMap Hash table based implementation of the Map interface. This implementation provides all of th ...

  6. centOS7 mini配置linux服务器（三） 配置防火墙以及IPtables切换

    一.firewall介绍 CentOS 7中防火墙是一个非常的强大的功能,在CentOS 6.5中在iptables防火墙中进行了升级了. 1.官方介绍 The dynamic firewall da ...

  7. Extjs中grid前端分页使用PagingMemoryProxy【二】

        在项目中遇到Grid前端分页,本人也是刚接触extjs没多久,为了实现效果,一直找了很久才实现出来,对于代码中的一些也不能详细的说明出来, 不知道能不能帮助到遇到同样问题的朋友,所以将例子代码 ...

  8. Jemter+Badboy实战经验一（Badboy录制及基础功能）

    1. 使用工具: Apache Jemeter:http://jmeter.apache.org/download_jmeter.cgi (免费官网下载地址) BadBoy:   http://www ...

  9. Java中整形、浮点、字符之间的转换

    如:String s = "123";int num = Integer.parseInt(s);注意:当应用程序试图将字符串转换成一种数值类型,但该字符串不能转换为适当格式时,会 ...

  10. 1632: [Usaco2007 Feb]Lilypad Pond

    1632: [Usaco2007 Feb]Lilypad Pond Time Limit: 5 Sec  Memory Limit: 64 MBSubmit: 404  Solved: 118[Sub ...