• AngularJS过滤器


    1、currency:过滤器可以将一个数值格式化为货币,{{ 123 | currency:'¥' }}
    <p>{{123.456789 | currency :'¥'}}</p>
    输出结果:
    ¥123.46
    2、date:过滤器可以将日期格式化成需要的格式。AngularJS中内置几种日期格式,如果没有指定使用任何格式,默认会采用mediumDate格式。 
    <p>{{1466673331428 | date:'yyyy-MM-dd HH:MM:ss' }}</p>
    输出结果:
    2016-06-23 17:06:31
    3、filter:filter过滤器可以从给定数组中选择一个子集,并将其生产一个新数组返回。
    <p>{{ [{'name':'Ari','age':25},{'name':'Join','age':23}] | filter:'Ari'}}</p>
    <p>{{oFilter | filter:{'name':'Ari','age':25} }}</p>
    输出结果:
    [{"name":"Ari","age":25}]
    4、json:过滤器可以将一个JSON或者JavaScript对象转化成字符串。 
    <p>{{ [{'name':'Ari','age':25},{'name':'Join','age':23}] | filter:json }}</p>
    输出结果:
    [{"name":"Ari","age":25},{"name":"Join","age":23}]
    5、limitTo:过滤器会根据传入的参数生产一个新的数组或字符串,新的数组或字符串的长度取决传入的参数,通过传入的参数的正负值来控制从前面还是后面截取(对字符串没有截取效果)。
    <p>{{ 123456677 | limitTo:2 }}</p>
    <p>{{ "i love tank" | limitTo:6 }}</p> 
    输出结果:
    123456677
    i love tank
    <p>{{ ['a','b','c','d'] | limitTo:2 }}</p> 
    输出结果:
    ["a","b"]
    6、lowercase:过滤器将字符串转化成小写。
    <p>{{"abc" | uppercase }}</p>  
    输出结果:
    ABC
    7、uppercase:过滤器将字符串转化成大写。
    <p>{{"ABC" | uppercase }}</p>  
    输出结果:
    abc
    8、number:过滤器将数字格式化成文本。他的第二个参数是可选的,用来控制截取小数点后截取的位数。
    <p>{{12.3456789 | number:2 }}</p>  
    <p>{{123456789 | number }}</p> 
    输出结果:
    12.35
    123,456,789
    9、orderBy:过滤器可用表达式对指定的数组进行排序,orderBy可以接收两个参数,第一个是必选的,第二是可选的。
    <p>{{ [{'name':'Ari','age':25},{'name':'Join','age':23}] | orderBy:'name':true }}</p>
    输出结果:
    [{"name":"Join","age":23},{"name":"Ari","age":25}]
    10、自定过滤器
    js:

      var app = angular.module('myApp',[]);
          app.controller('MyContro',function($scope){
          $scope.name = "join";
      });
      app.filter('firstCapitals',function(){
        return function(obj){
          var str = "";
          str = obj.charAt(0).toUpperCase()+obj.substr(1);
          return str;
        }
     });

     html:

    <div id="container" ng-controller="MyContro">
    {{name | firstCapitals }}
    </div>

  • 相关阅读:
    正则表达式(二):Unicode诸问题(上)
    ANT Notes
    Linux下OpenGL开发 -- 准备篇 (转)
    两个和尚
    Office 2008 for Mac 安装笔记
    从软件工程师到IT猎头:我的一点经历和感触 (转)
    One splitpath implementation (platform independent)
    ANT的使用(转)
    80后中专毕业奋斗10年 我的理财选择
    用ANT来实现邮件发送
  • 原文地址:https://www.cnblogs.com/xiaoxiaosha/p/5611573.html
Copyright © 2020-2023  润新知