Angular 如何避免子组件滚动事件触发父组件中的更改检测

我使用的

BehaviorSubject

充当子组件的状态

state = new BehaviorSubject<any>({transform: 'translate3d(0, 0, 0)'});
styleState = this.state.asObservable();

然后我用scroll事件更新子组件状态

ngOnInit() {
  this.zone.runOutsideAngular(() => {

    fromEvent(this.el.nativeElement, 'scroll').pipe(
      tap((e: any) => {
        this.zone.run(() => {
          this.state.next({ scrollTop: e.target.scrollTop });
        });
      })
    ).subscribe();

  });
}

ngAfterViewChecked() {
  console.log('Parent View Checked!');
}

现在在父组件中，更改检测由子组件滚动事件触发

ngOnInit() {
  this.zone.runOutsideAngular(() => {

    fromEvent(this.el.nativeElement, 'scroll').pipe(
      tap((e: any) => {
        this.zone.run(() => {
          this.state.next({ scrollTop: e.target.scrollTop });
        });
      })
    ).subscribe();

  });
}

ngAfterViewChecked() {
  console.log('Parent View Checked!');
}

问题在于逻辑取决于滚动事件，我不希望它触发父组件中的更改检测。知道我在父组件和子组件中都使用了

OnPush

更改检测策略

state = new BehaviorSubject<any>({transform: 'translate3d(0, 0, 0)'});
styleState = this.state.asObservable();

这正常吗？我怎样才能避免呢

---

这里是一个最小的复制

这已经晚了，但对于仍在寻找解决方案的人来说：

发生这种情况的原因： 异步管道是特殊的，是OnPush更改检测策略关注的对象。本文有一节专门介绍异步管道，包含完整的解释以及许多其他相关信息：

潜在备选方案： 有很多方法可以做到这一点，但这里有一个快速的解决方案，可以在子组件中完成滚动的更改检测，而不会触发父组件中的更改检测。

---

现在已经晚了，但对于仍在寻找解决方案的人来说：

发生这种情况的原因： 异步管道是特殊的，是OnPush更改检测策略关注的对象。本文有一节专门介绍异步管道，包含完整的解释以及许多其他相关信息：

潜在备选方案： 有很多方法可以做到这一点，但这里有一个快速的解决方案，可以在子组件中完成滚动的更改检测，而不会触发父组件中的更改检测。

---

指向stackblitz的链接无效。@ConnorsFan我现在修复了它！这就是角度变化检测的工作原理。由于angular是异步进程发生时的组件树，因此更改检测将从应用程序根到底部触发。请检查此项：@Chellappan不确定，此处发生相反的情况，父级不会控制台日志

“父级视图已检查！”如果我没有订阅子系统中的滚动事件，则指向stackblitz的链接无效。@ConnorsFan我现在修复了它！这就是角度变化检测的工作原理。由于angular是异步进程发生时的组件树，因此更改检测将从应用程序根到底部触发。请检查此项：@Chellappan不确定，此处发生相反的情况，父级不会控制台日志
“父级视图已检查！”如果我没有订阅子系统中的滚动事件