AngularJS 过滤器
-
过滤器定义
可以在 AngularJS 中添加过滤器以格式化数据。AngularJS 提供了过滤器来转换数据:- currency 将数字格式化为货币格式。
- date 将日期格式化为指定的格式。
- filter 从数组中选择项的子集。
- json 将对象格式化为JSON字符串。
- limitTo 将数组/字符串限制为指定数量的元素/字符。
- lowercase 将字符串格式化为小写
- uppercase 将字符串格式设置为大写。
- number 将数字格式化为字符串
- orderBy 通过表达式对数组进行排序。
-
向表达式添加过滤器
可以使用竖线字符 | 将过滤器添加到表达式中,然后使用过滤器。uppercase 过滤器将字符串格式转换为大写:lowercase 过滤器将字符串格式转换为小写: -
将过滤器添加到指令
通过使用竖线字符 |,将过滤器添加到指令(例如ng-repeat),然后加上过滤器:orderBy 过滤器对数组进行排序: -
currency 过滤器
currency 过滤器将数字格式化为货币: -
filter 过滤器
filter 过滤器选择数组的子集。filter 过滤器只能在数组上使用,它返回仅包含匹配项的数组。下面示例返回包含字母 "i" 的名称: -
根据用户输入过滤数组
通过在输入字段上设置ng-model
指令,我们可以将输入字段的值用作过滤器中的表达式。下面示例返回在input中输入字母,列表将根据匹配项来返回包含字母的名称: -
根据用户输入对数组排序
单击表标题以更改排序顺序:名字 国家 {{x.name}} {{x.country}} 通过在表头上添加ng-click
指令,我们可以运行一个函数来更改数组的排序顺序: -
自定义过滤器
您可以通过在 module(模块) 中注册新的过滤器工厂功能来制作自己的过滤器。创建一个名为 "myFormat" 的自定义过滤器:myFormat 筛选器会将所有不是2的百分余数的字符格式化为大写。
有关过滤器的更多信息,请到我们的 AngularJS 参考手册 中阅读