多语言展示
当前在线:1375今日阅读:195今日分享:14

angularjs如何使用filter过滤器

在使用angularjs的时候,我们经常会遇到过滤器filter。比较常用的就是在html中遍历的时候进行按某一字段进行过滤,下面小编给大家分享一下angularjs如何使用filter过滤器
工具/原料

Visual Studio 2017

方法/步骤
1

首先我们新建一个Web项目来做演示,我这里建的是net的MVC项目,如下图所示:

2

然后我们打开Index.cshtml文件,在文件中写入如下的html代码,我们放置了angular相关的内容,如下图所示:

3

接下来我们要准备控制器,并准备一个集合数据用于展示了,如下图所示,准备了4组数据

4

下面我们运行一下程序,你会在浏览器中看到如下内容的输出

5

然后我们回到Index.cshtml文件,我们在ng-repeat后面加一个filter过滤,如下图所示:

6

再次运行程序,你会看到如下图的输出样式,把我需要的名称过滤出来了。

7

当然如果你想过滤比如按age字段大于某个值的,就需要写一个处理方法了,然后在filter中调用处理方法,如下图所示:

推荐信息