javascript - 在 Angular2 中，检测组件滚动的最简单方法是什么

Question

我将 Angular2 与 Typescript 和 HTML5 结合使用。

当滚动发生时，我希望它调用我的组件中的函数。

通常在 Angular 1 中我会在滚动条上放置一个观察者。我该如何为 Angular2 执行此操作？

这是我当前的尝试:

  @HostListener('scroll', ['$event']) private onScroll($event:Event):void {
        console.log("Scrolling occurred!");
   };

但是 console.log 没有被命中。

您能否提供该问题的 html 和 typescript 答案。

谢谢

Answer 1

您可以使用rxjs来处理该事件:

import {Observable} from 'rxjs';

let source = Observable.fromEvent(document, 'scroll');
let subscription = source.subscribe(e => console.log('scroll', e));

现在，每次发生滚动时，源都会发出一个您可以监听的事件。

参见: http://reactivex.io/rxjs/class/es6/Observable.js~Observable.html#static-from-event