Ionic 2滾動事件

Question

我有一個離子滾動組件。 我想在滾動期間執行一些代碼。在Ionic 1中，可以使用on-scroll屬性並傳遞一個函數。

該文檔也丟失。在Ionic 2中是否有內置的檢測滾動功能，還是我不得不使用jQuery或窗口滾動事件添加我自己的事件處理程序？

Answer 1

我發現這裏的解決方案：「On-scroll」 not working in

使用"addScrollEventListener"內"ngAfterViewChecked"。

Answer 2

您可以使用滾動部件的addScrollEventListener方法，像這樣：

this.scroll.addScrollEventListener((event) => { 
    console.log(event); 
}); 

你的HTML：

<ion-header> 
    <ion-navbar> 
     <ion-title>Title</ion-title> 
    </ion-navbar> 
</ion-header> 

<ion-content class="no-scroll"> 
    <ion-scroll></ion-scroll> 
</ion-content> 

您的打字稿：

import {Component, ViewChild} from '@angular/core'; 
import {Scroll} from 'ionic-angular'; 

@Component({ 
    selector: 'page-home', 
    templateUrl: 'home.html' 
}) 

export class HomePage { 
    @ViewChild(Scroll) scroll: Scroll; 

    constructor() {} 

    ngAfterViewInit() { 
     this.scroll.addScrollEventListener(this.onScroll); 
    } 

    onScroll(event) { 
     console.log(event); 
    } 
} 

Answer 3

，我發現從這裏該解決方案：https://forum.ionicframework.com/t/ionic-2-rc4-addscrolllistener/73145/16?u=kamleshappster

this.content.ionScroll.subscribe(($event) => { 
this.scrollAmount = $event.scrollTop; 
});