fix(content): scroll listener is auto enabled

fixes ionic-team#10938

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<ScrollEvent> = new EventEmitter<ScrollEvent>();
 
   /**
    * @output {ScrollEvent} Emitted on every scroll event.
-   */
-  @Output() ionScroll: EventEmitter<ScrollEvent> = new EventEmitter<ScrollEvent>();
+   * If it is used programatically, scroll events must be enabled explicitally with `enableScrollListener()`:
+   *
+   * ```ts
+   * content.ionScroll((ev) => onEvent(ev));
+   * content.enableScrollListener();
+   * ```
+   *
+   */  @Output() ionScroll: EventEmitter<ScrollEvent> = new EventEmitter<ScrollEvent>();
 
   /**
    * @output {ScrollEvent} Emitted when scrolling ends.
-   */
-  @Output() ionScrollEnd: EventEmitter<ScrollEvent> = new EventEmitter<ScrollEvent>();
+   * If it is used programatically, scroll events must be enabled explicitally with `enableScrollListener()`:
+   *
+   * ```ts
+   * content.ionScrollEnd((ev) => onEvent(ev));
+   * content.enableScrollListener();
+   * ```
+   *
+   */  @Output() ionScrollEnd: EventEmitter<ScrollEvent> = new EventEmitter<ScrollEvent>();
 
 
   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');