本文介绍了在Angular项目中实现前端实时搜索功能的方法。通过ng-model绑定搜索关键字，结合filter和orderBy指令，实现输入关键字时列表条目及总数的实时更新。详细步骤包括：1) 使用input组件绑定搜索关键字；2) 利用ng-repeat遍历经过filter和orderBy处理后的数据列表。
1. 在项目中，会遇到初始化页面是一个列表，但页面中包含有一个input搜索框，输入关键字搜索的时候，列表需要实时变化，列表条目总数也需要实时变化。类似下图的需求。
解决方案如下：
<input placeholder="输入镜像名称查找" ng-model="projectImageKey"/>
<ul>
<li ng-repeat="item in projectImagesFiltered=(imageProjectCollections|filter:{'projectCollectionName ':projectImageKey})|orderBy:'projectCollectionName '"></li>
</ul>
说明：
最低0.47元/天 解锁文章
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
