AangularJS过滤器详解

（参考angular权威指南）

过滤器：   用来格式化需要展示给用户的数据；

　　使用过滤器的方式：

　　　　(1)$scope.name=$filter("lowercase").("Ariarme");

　　　　(2)以HTML形式使用过滤器：如果传递参数只要在过滤器名字后面加冒号，有多个参数，可以在每个参数后面都加入冒号；

　　　　　　　　{{123.456789 | number:2}}  限制小数点的位数-----显示为123.46（四舍五入）

(3)用 | 符号作为分隔符来同时使用多个过滤器；

　　AngularJS提供的内置过滤器：

　　　　　currency ： 将一个数值格式化为货币格式，用{{123 | currency}}  将123转化成货币格式；

　　　　　　　　　　　它允许我们自己设置货币符号：如  {{123 | currency : "￥"}} 显示为￥123.00.00；

date: 可以将日期格式化成需要的格式；

内置的支持本地化的日期格式：

{{today | date 'medium'}}   Aug 09,2014 9:45:08 AM

　　　　　　　　　{{today | date 'short'}}       8/9/14 9:45AM

　　　　　　　　　{{today | date 'fullDate'}}   Thursday,August 09,2014

　　　　　　　　　{{today | date 'longDate'}}   August 09,2014

　　　　　　　　　{{today | date 'mediumDate'}}   Aug 09,2014

　　　　　　　　　{{today | date 'shorDate'}}     8/9/14

　　　　　　　　　{{today | date 'mediumTime'}}   9:45:08 AM

　　　　　　　　　{{today | date 'shortTime'}}       9:45 AM;

　　　　　　　　年份格式化：

四位年份：{{today | date 'yyyy’}}  2017

　　　　　　　　　两位年份：{{today | date 'yy‘}}     17

　　　　　　　　　一位年份：{{today | date 'y‘}}  2017

　　　　　　　　月份格式化：

　　　　　　　　　英文月份：{{taday |date:'MMMM'}} August

　　　　　　　　　英文月份j简写 {{taday |date:'MMM'}} Aug

　　　　　　　　　数字月份：{{taday |date:'MM'}}  08

　　　　　　　　　一个月中第几个月份：：{{taday |date:'M'}}  8

　　　　　　　  日期格式化：

　　　　　　　　　数字日期：{{today | date:'dd'}}  22

　　　　　　　　　一个月中的第几天：{{today | date:'d'}} 22

英文星期： {{today | date:'EEEE'}} Thrusday

英文星期简写：{{today | date:'EEE'}}Thu

　　　　　　   小时格式化：

　　　　　　　　  24小时制数字小时：{{today | date:'HH'}} 00

　　　　　　　　　一天中的第几个小时：{{today | date: 'H'}} 0

　　　　　　　　　12小时制数字小时：{{today | date:'hh'}} 12

　　　　　　　　   上午或下午的第几个小时：：{{today | date:'h'}} 12

　　　　　　    分钟格式化：

　　　　　　　　　数字分钟数：{{today | date : 'mm'}} 05

　　　　　　　　　一个小时的第几分钟：{{today | date : 'm'}} 5

　　　　　　　 秒数格式化：

　　　　　　　　　数字秒数：{{today | date 'ss'}} 09

　　　　　　　　　一分钟内的第几秒:{{today | date 's'}} 9

　　　　　　　　　毫秒数：{{today | date 'sss'}}

　　　　　　 　字符格式化：

　　　　　　　　  上下午标示：{{today | date: 'a'}} AM

　　　　　　　　　四位时区标示：{{today | date 'Z'}} 0700

自定义日期格式：

{{today | date:'hh:mm:ss'}}  23:15:40

　　　　　　　　　{{today | date:'yyyy-MM-dd hh:mm:ss'}} 2017 -5-22 23:15:40

　　　　

　　　　　filter: 可以从给定数组中选择一个子集，并将其生成一个新数组返回；通常过滤需要进行展示的元素；

　　　　　　　　参数：第一个参数可以是 字符串、对象、或是一个用来从数字中选择元素的函数；

　　　　　　　　　　　第二个参数用来指定预期同实际值进行比较的方式；

参数设置为true: 表示用angular.equals(expected,actual)对两个值进行严格比较；

参数设置为false:进行区分大小写的子字符串比较；

参数设置为函数：运行这个函数，如果返回真值就接受这个元素；

　　　　　json:   可以将一个JSON或JavaScript对象转化成字符串；

　　　　  limitTo: 过滤器根据传入的参数生成一个新的数组或字符串，新的数组或字符串的长度取决于传入的参数，通过传入的参数的正负来控制从前面还是从后面开始截取；

　　　　　lowercase:  过滤器将字符串转化为小写；

　　　　　 uppercase: 过滤器将字符串转化为大写；

　　　　　 number: 将数字格式化成文本，第二个参数可选，用来控制截取小数点的位数，如果传入的是非数字字符，会返回空字符串；

　　　　　　　　　　{{123456789 | number}}   1,234,567,890

　　　　　　　　　　{{1.23456789 | number:2}}   1.23

　　　　　　orderBy:过滤器可以用表达式对指定的数组进行排序，它接受两个参数，第一个是必须的，第二个是可选的，控制排序的方向，第二个参数设置为true，排序反转；

　　　　　　　　　　例如：{{---  | orderBy:'name':true}}

使用+是升序，-是降序；orderBy:'- age';按年龄的降序排列；

自定义过滤器：

自定义过滤器创建是非常容易的，本质上市会把我们输入的内容当作参数传入进去的函数；

列子： angular.module('mainApp',[]).filter('capitlize',function(){

　　　　　　　　　　　　return function(input){

　　　　　　　　　　　　　　if(input){

　　　　　　　　　　　　　　　　　return input[0].toUpperCase() + input.slice(1);

　　　　　　　　　　　　　　}

　　　　　　　　　　　　}

　　　　　　　　　　});     //将字符串的一个字母转化为大写的过滤器