How to detect scroll using Ionic 2+ and Angular 2+?

Question

Is it possible to detect when the window is scrolled?

I have tried adding HostListener:

@HostListener("window:scroll", [])
onScroll() {
   console.log('scroll');
}

And I have tried using Renderer2:

this.renderer.listen(
   'window',
   'scroll',
   (evt) => {
      console.log('scroll');
   }
);

Neither work.

Answer 1

in your html file add this

<ion-content [scrollEvents]="true"></ion-content>

in your your .ts file add this

@HostListener('ionScroll', ['$event']) onScroll(event){
    console.log(event.detail.scrollTop)
    console.log('im scrolling')
}

Answer 2

you can detect the scroll with below code, just as your first code snippet..

 @HostListener('window:scroll')
 onWindowScroll():void {
   let isScrolled = window.scrollY > this.heightToCompare;
   if (isScrolled !== false) {
      //  do what you want  
   } 
 }