我有一个大型数组,我在一个组件(组件 A)中使用*ngFor
了一个嵌套的*ngFor
.
组件 B 初始化一个注册文档mousemove
事件处理程序的 jquery 插件,我正在使用this.zone.runOutsideAngular
它来初始化插件,并且我this.ref.detectChanges()
在回调中调用,因为我需要更新mousemove
组件 B 内部的UI。
组件 A 不是组件 B 的子组件。
一旦组件 A 被渲染,变更检测就会变得非常缓慢。数组没有改变,我正在使用ChangeDetectionStrategy.OnPush
组件 A 的策略,但是当我ref.detectChanges()
在组件 B 内部触发时,ngDoCheck
在组件 A 上被调用,我可以看到mousemove
.
有没有办法告诉 Angular 完全忽略组件 A 中的大量项目并允许我处理何时应该更新 UI?我认为 usingChangeDetectionStrategy.OnPush
会给我我需要的东西,但我已经尝试@Input()
从组件 A 中删除所有 s 并且任何时候我this.ref.detectChanges()
在组件 B 内部调用它仍然在触发ngDoCheck
,很明显这很慢。
我可以滚动浏览项目列表没有问题,但是当我触发组件 B 的detectChanges
内部mousemove
时会导致问题。我知道我可以手动更新 DOM,但我认为这只是一种解决方法,因为它只会解决 mousemove 上的卡顿,而不是围绕更改检测缓慢的问题。