AngularJS中的过滤器使用详解

过滤器是用来更改修改数据，并且可以在表达式或使用管道符指令将其归入。以下是常用的过滤器的列表。

小写过滤器

添加小写的过滤器，使用管道符的表达式。在这里添加小写过滤器，以小写字母打印学生姓名。

输入名字：输入类型=' text ' ng-model=' student。'名字'输入姓氏：输入类型=' text ' ng-model=' student。“姓氏”大写的姓名： {{student.fullName() |小写}}货币滤波器

加币过滤器使用管道符返回数的表达式。在这里，我们添加了过滤器，货币使用货币格式的打印费用。

输入fees:输入类型=' text ' ng-model=' student。费用'费用： { { student。费用|货币} }过滤器的过滤器

要仅显示所需的主题，我们使用主题名称作为过滤器。

输入主题：输入类型=' text ' ng-model=' subject name ' subject : ul Li ng-repeat=' subject in student。主题|筛选器：主题名称“{ subject。名称'，标记： '主题。mark } }/Li/ul排序过滤器

要通过标记排序主题，我们使用订单方标记。

科目： ul Li ng-repeat='学生科目。主题|按：个“标记”排序{ { subject。名称'，标记： '主题。mark } }/Li/ul例子

下面的例子将展示上述所有的过滤器。testAngularJS.html

html标题标题角度JS过滤器/标题/标题2角度JS示例应用程序/H2分部ng-app=' ng-controller=' student controller '表边框=' 0 ' TRT输入名字：/TDT输入类型='text ' ng-model=' student。姓氏/TRT输入名字：/TDT输入类型=' text ' ng-model=' student。姓氏'/TD/TRT输入费用：/TDT输入类型=' text ' studentObject=$ scope . student返回studentobject。名为“studentobject”。姓氏；} };}/script script src=' http :http://Ajax。谷歌API。com/Ajax/libs/angular js/1。2 .15/棱角分明。量滴js '/脚本/正文/html输出

在网浏览器打开textAngularJS.html，看到以下结果：