Angular中监控DIV层中的scroll事件

1、先添加 angular 生命周期钩子：

1. ngAfterViewInit() 钩子是在组件视图或者子组件视图初始化完成之后调用。
2. ngOnDestroy() 钩子是当 Angular 每次销毁指令 / 组件之前调用。

  ngAfterViewInit() {
    this.ngScroll();
  }

  ngOnDestroy() {
    this.rmScroll();
  }

2、ngScroll() 方法添加 addEventListener 监测 DIV层的scroll事件：

ngScroll() {
    let _scroll = document.querySelector('.news-box').children[0];
    _scroll.addEventListener('scroll', () => {
      let scrollTop = document.querySelector('.news-box').children[0].scrollTop;
      if (scrollTop > 150) {
        //执行事件
      } else {
        //执行事件
      }
    });
  }

3、rmScroll() 方法用于移除由 addEventListener() 方法添加的事件句柄：

rmScroll() {
    let targetScroll = document.querySelector('.news-box').children[0];
    targetScroll.removeEventListener('scroll', this.ngScroll);
  }