2017-04-03 3 views
2

사용자가 이오닉 2를 스크롤하면 픽업이 혼란 스럽습니다. 나는 기본적으로 사용자가 페이지를 아래로 스크롤 할 때 뭔가를하고 싶다고 말하고 싶다.OnScroll 이벤트 이오닉 2

모든 예는 훌륭합니다.

UPDATE :

내 생성자이있다, 그래서 페이지 스크롤 내가 키보드를 종료 할 때 개폐 다른 방법 방치로 인해.

import { Component, ViewChild } from '@angular/core'; 
import { NavController, NavParams, Content } from 'ionic-angular'; 
import { Keyboard } from '@ionic-native/keyboard'; 

export class SearchPage { 

    @ViewChild(Content) 
    content:Content; 

    constructor(public keyboard: Keyboard, public formBuilder: FormBuilder, public navCtrl: NavController, public navParams: NavParams, public apiAuthentication: ApiAuthentication, private http: Http) { 

    this.content.ionScroll.subscribe((data)=>{ 
     this.keyboard.close(); 
    }); 
    } 
} 

그러나이 오류 Cannot read property 'ionScroll' of undefined 내가 잘못된 장소에 걸었습니다 얻을?

+0

I :

<ion-content (ionScroll)="onScroll($event)"> 
devqon

답변

17

콘텐츠 이벤트에 가입 할 수 있습니다.

콘텐츠 3 output events 있습니다 ionScroll 모든 스크롤 이벤트에서 방출 된

  • .
  • ionScrollEnd 스크롤이 끝나면 방출됩니다.
  • ionScrollStart 스크롤을 처음 시작할 때 발생합니다.

이벤트 듣기 :

@ViewChild(Content) 
content: Content; 
// ... 
ngAfterViewInit() { 
    this.content.ionScrollEnd.subscribe((data)=>{ 
    //... do things 
    }); 
} 

또는 DOM에서 작업을 수행합니다

import { Renderer2 } from '@angular/core'; 
... 
constructor(private renderer: Renderer2) {} 

ngOnInit() { 
    this.renderer.listen(this.myElement, 'scroll', (event) => { 
     // Do something with 'event' 
     console.log(this.myElement.scrollTop); 
    }); 
} 
+0

고마워요! 내가 gettign 오전 오류로 질문을 업데이 트했습니다 – BA1995

+0

당신은 자식 구성 요소'콘텐츠'를 받았습니까? – Erevald

+0

예 .ts 파일의 주요 측면을 다시 표시하도록 업데이트했습니다. – BA1995

0

사용자 정의 지시어 내에서이 같은 뭔가 시도 보기에 ' '태그가 있다고 가정합니다. 그리고 아마도 생성자 대신 이온의 뷰 라이프 사이클 중 하나에서 이벤트를 구독해야합니다.