AngularJS - 过滤器

AngularJS过滤器 - 从简单和简单的步骤学习AngularJS，从基本到高级概念，包括概述，环境设置，MVC架构，第一应用程序，指令，表达式，控制器，过滤器，表，HTML DOM，模块，表单，包含，Ajax ，视图，范围，服务，依赖注入，自定义指令，内部化，ToDo应用程序，记事本应用程序，Bootstrap应用程序，登录应用程序，上载文件，在线应用程序，导航菜单，切换菜单，订单表格，搜索选项卡，拖动应用程序，购物车申请，翻译申请，图表申请，地图申请，分享申请，天气申请，计时器申请，传单申请，Lastfm申请。

过滤器用于修改数据.它们可以使用管道(|)字符在表达式或指令中进行分组.以下列表显示了常用的过滤器.

Sr.No.	姓名&说明
1	uppercase 将文本转换为大写文本.
2	lowercase 将文本转换为小写文本.
3	currency 以货币格式格式化文本.
4	filter 过滤数组到它的一部分基于提供的标准.
5	orderby 根据提供的标准对数组进行排序.

大写过滤器

使用竖线字符向表达式添加大写过滤器.这里我们添加了大写过滤器以全部大写字母打印学生姓名.

Enter first name:Enter last name: Name in Upper Case: {{student.fullName() | uppercase}}

小写过滤器

使用竖线字符将小写过滤器添加到表达式.这里我们添加了小写过滤器以全小写字母打印学生姓名.

Enter first name:Enter last name: Name in Lower Case: {{student.fullName() | lowercase}}

货币过滤器

使用竖线字符向表达式返回数字添加货币过滤器.在这里，我们添加了货币过滤器以使用货币格式打印费用.

Enter fees: fees: {{student.fees | currency}}

过滤器

要仅显示必需的主题，我们使用subjectName作为过滤器.

Enter subject: Subject:         {{ subject.name + ', marks:' + subject.marks }}

OrderBy过滤器

要按标记订购主题，我们使用orderBy标记.

Subject:         {{ subject.name + ', marks:' + subject.marks }}

示例

以下示例显示了使用上述所有过滤器.

testAngularJS.htm

         Angular JS Filters                           AngularJS Sample Application
                                                Enter first name:                                                      Enter last name:                                                       Enter fees:                                                       Enter subject:                                              
                                             Name in Upper Case: {{student.fullName() | uppercase}}                                       Name in Lower Case: {{student.fullName() | lowercase}}                                       fees: {{student.fees | currency}}                                                      Subject:                                                                              {{ subject.name + ', marks:' + subject.marks }}

输出

在Web浏览器中打开文件 testAngularJS.htm .查看结果.