问题描述
我想向我的应用程序添加自定义排序和过滤功能,并希望它们可以重复使用(跨多个组件)。上述函数将用于允许用户在我的模板中对列表/表格内容进行排序和过滤数组。此外,某些内容可以根据用户的操作动态修改(例如:如果远程用户通过我们的数据库向表中列出的集合添加新元素,则本地用户的更新数据应尊重先前应用的排序/过滤)。 我的理解是,管道在这种情况下并不是真正的最佳选择,因为 changes of the sort are impure。
使用纯管道,Angular 会忽略复合对象内的更改,例如现有数组的新添加元素,因为检查原始值或对象引用比执行深入检查对象内的差异要快得多。 Angular 可以快速判断是否可以跳过执行管道和更新视图。
我对纯/不纯变化的理解是错误的吗? 如果不是,那么实现可重用的 orderBy/filterBy 函数有什么好的替代方法?
解决方法
你是对的,如果你有一个数组,并且它的元素发生了变化,如果数组的引用保持不变,纯管道将不会更新。
我建议您考虑一种反应式方法,使用 BehaviorSubject
/Observable
和 async
管道将数据发送到您的视图。这将在发出新数据时触发更改检测,您可以自由使用纯管道来过滤数据。
Here is a solid article 关于使用 async
管道。
不纯的管道不会有性能,但纯管道会,所以这是最好的方法,是的,Angular 不会检测复合变化,这就是 immutability 很棒的原因。