在 angularjs 开发中，过滤器（filter）是一项高频使用的特性，广泛应用于 html 模板中对循环数据进行条件筛选，尤其适用于按字段动态过滤列表内容。本文将系统讲解 angularjs 中 filter 过滤器的基本用法与实用技巧，助力开发者更灵活地组织数据展示逻辑，优化前端渲染性能与用户交互体验。

1、 首先创建一个 Web 应用项目作为演示环境，本文以基于 .NET 平台的 MVC 架构项目为例，项目结构如下图所示。

2、 打开 Index.cshtml 视图文件，嵌入支持 AngularJS 的 HTML 结构，并引入必要的 ng-app 与 ng-controller 指令，完整代码结构参考下图。

3、 在控制器中完成初始化配置，定义用于视图绑定的数据集合，本例共准备四条模拟用户记录，包含姓名、年龄等关键字段，具体实现如下图所示。

4、 启动应用后，页面初始渲染效果如下所示。

Wjs Localizing Video

用于端到端视频本地化流程的轻量编排器，路由至四个专注子技能——/wjs-transcribing-audio、/wjs-translating-subtitles...

下载

5、 回到 Index.cshtml 文件，在 ng-repeat 指令中添加内置 filter 表达式，实现对 name 字段的模糊匹配筛选，操作细节见下图。

6、 再次运行项目，可见视图已精准呈现符合筛选条件的条目，验证 filter 功能正常生效。

7、 如需实现更复杂的筛选逻辑（例如：仅显示 age 大于指定数值的记录），可自定义 JavaScript 函数并在 filter 中调用，完整实现方式参见下图所示。