From e1f542548e9accffe05e00a556941fca70166425 Mon Sep 17 00:00:00 2001 From: Manuel Mtz-Almeida Date: Wed, 29 Mar 2017 14:36:49 +0200 Subject: [PATCH] fix(content): scroll listener is auto enabled fixes #10938 --- src/components/content/content.ts | 54 +++++++++++++++++++++++++++---- 1 file changed, 48 insertions(+), 6 deletions(-) diff --git a/src/components/content/content.ts b/src/components/content/content.ts index a9235064cbb..743f0bc7139 100644 --- a/src/components/content/content.ts +++ b/src/components/content/content.ts @@ -1,4 +1,4 @@ -import { ChangeDetectionStrategy, Component, ElementRef, EventEmitter, Input, NgZone, OnDestroy, Optional, Output, Renderer, ViewChild, ViewEncapsulation } from '@angular/core'; +import { AfterViewInit, ChangeDetectionStrategy, Component, ElementRef, EventEmitter, Input, NgZone, OnDestroy, Optional, Output, Renderer, ViewChild, ViewEncapsulation } from '@angular/core'; import { App } from '../app/app'; import { Config } from '../../config/config'; @@ -125,7 +125,7 @@ export { ScrollEvent } from '../../util/scroll-view'; changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None }) -export class Content extends Ion implements OnDestroy { +export class Content extends Ion implements OnDestroy, AfterViewInit { /** @internal */ _cTop: number; /** @internal */ @@ -311,18 +311,37 @@ export class Content extends Ion implements OnDestroy { /** * @output {ScrollEvent} Emitted when the scrolling first starts. + * If it is used programatically, scroll events must be enabled explicitally with `enableScrollListener()`: + * + * ```ts + * content.ionScrollStart((ev) => onEvent(ev)); + * content.enableScrollListener(); + * ``` + * */ @Output() ionScrollStart: EventEmitter = new EventEmitter(); /** * @output {ScrollEvent} Emitted on every scroll event. - */ - @Output() ionScroll: EventEmitter = new EventEmitter(); + * If it is used programatically, scroll events must be enabled explicitally with `enableScrollListener()`: + * + * ```ts + * content.ionScroll((ev) => onEvent(ev)); + * content.enableScrollListener(); + * ``` + * + */ @Output() ionScroll: EventEmitter = new EventEmitter(); /** * @output {ScrollEvent} Emitted when scrolling ends. - */ - @Output() ionScrollEnd: EventEmitter = new EventEmitter(); + * If it is used programatically, scroll events must be enabled explicitally with `enableScrollListener()`: + * + * ```ts + * content.ionScrollEnd((ev) => onEvent(ev)); + * content.enableScrollListener(); + * ``` + * + */ @Output() ionScrollEnd: EventEmitter = new EventEmitter(); constructor( @@ -383,6 +402,29 @@ export class Content extends Ion implements OnDestroy { /** * @hidden */ + ngAfterViewInit() { + if (this.hasScrollObservers()) { + console.debug('Auto enabling scroll listener'); + this.enableScrollListener(); + } + } + + /** + * @hidden + */ + hasScrollObservers(): boolean { + return this.ionScroll.observers.length > 0 || + this.ionScrollStart.observers.length > 0 || + this.ionScrollEnd.observers.length > 0; + } + + /** + * Enables scroll events listening. By default, scroll events are disabled, so + * subscribing to `(ionScroll)`, `(ionScrollStart)` and `(ionScrollEnd)` will not fire any event. + * + * Listening for scroll events is an expensive operation, that runs at 60FPS. + * So it is a good idea to keep it disabled as long you are not using them. + */ enableScrollListener() { assert(this.getFixedElement(), 'fixed element was not found'); assert(this.getScrollElement(), 'scroll element was not found');