angular项目随笔——前端实现实时搜索展示搜索列表
发布时间
阅读量：
阅读量
1. 在项目中，会遇到初始化页面是一个列表，但页面中包含有一个input搜索框，输入关键字搜索的时候，列表需要实时变化，列表条目总数也需要实时变化。类似下图的需求。
解决方案如下：
说明：
projectImageKey：表示输入的搜索关键字
item : 表示列表数据里面的每一条目
imageProjectCollections：拿到的最原始的数据列表
projectCollectionName ： 列表进行排序的关键字段
projectImagesFiltered ：经过排序（orderby），经过过滤（filter）之后的数据
li的这句话要做的事就是：①原始数据列表imageProjectCollections按照列表每一条item 里的属性projectCollectionName 排序 ②再对上一步得到的数据列表进行过滤（过滤条件是projectCollectionName 属性与搜索关键字projectImageKey相同的数据）得到一个新的列表 ③将经过一系列处理的数据列表赋值给一个变量projectImagesFiltered，这样就可以做到搜索实时变化列表，用projectImagesFiltered获取到的length也是实时变化的
全部评论 (0)
还没有任何评论哟~