From fceb7afa3919931a0404d83a181327d317ee34be Mon Sep 17 00:00:00 2001 From: mmalerba Date: Mon, 13 Aug 2018 09:43:04 -0700 Subject: [PATCH] cleanup(cdk-scrollable): use fromEvent under the hood (#12589) --- src/cdk/scrolling/scrollable.ts | 29 +++++++++++++---------------- 1 file changed, 13 insertions(+), 16 deletions(-) diff --git a/src/cdk/scrolling/scrollable.ts b/src/cdk/scrolling/scrollable.ts index 9b6d17893c3..afd6b84d77b 100644 --- a/src/cdk/scrolling/scrollable.ts +++ b/src/cdk/scrolling/scrollable.ts @@ -6,8 +6,9 @@ * found in the LICENSE file at https://angular.io/license */ -import {Directive, ElementRef, OnInit, OnDestroy, NgZone} from '@angular/core'; -import {Observable, Subject} from 'rxjs'; +import {Directive, ElementRef, NgZone, OnDestroy, OnInit} from '@angular/core'; +import {fromEvent, Observable, Subject} from 'rxjs'; +import {takeUntil} from 'rxjs/operators'; import {ScrollDispatcher} from './scroll-dispatcher'; @@ -20,36 +21,32 @@ import {ScrollDispatcher} from './scroll-dispatcher'; selector: '[cdk-scrollable], [cdkScrollable]' }) export class CdkScrollable implements OnInit, OnDestroy { - private _elementScrolled: Subject = new Subject(); - private _scrollListener = (event: Event) => this._elementScrolled.next(event); + private _destroyed = new Subject(); + + private _elementScrolled: Observable = Observable.create(observer => + this._ngZone.runOutsideAngular(() => + fromEvent(this._elementRef.nativeElement, 'scroll').pipe(takeUntil(this._destroyed)) + .subscribe(observer))); constructor(private _elementRef: ElementRef, private _scroll: ScrollDispatcher, private _ngZone: NgZone) {} ngOnInit() { - this._ngZone.runOutsideAngular(() => { - this.getElementRef().nativeElement.addEventListener('scroll', this._scrollListener); - }); - this._scroll.register(this); } ngOnDestroy() { this._scroll.deregister(this); - - if (this._scrollListener) { - this.getElementRef().nativeElement.removeEventListener('scroll', this._scrollListener); - } - - this._elementScrolled.complete(); + this._destroyed.next(); + this._destroyed.complete(); } /** * Returns observable that emits when a scroll event is fired on the host element. */ - elementScrolled(): Observable { - return this._elementScrolled.asObservable(); + elementScrolled(): Observable { + return this._elementScrolled; } getElementRef(): ElementRef {