2015-09-09 17 views
12

obecnie pracuję w jonowym frameworku na javascript i kątowym-js właśnie umieszczam pole wyszukiwania i renderuję listę klientów, ale przypuszczam, że w pierwszej próbie mogę wyszukać za pomocą "a" pokazuje wszystkie elementy, które mają alfa "a", ale problem występuje wtedy, gdy przewijam w dół, aby zobaczyć listę wyników wyszukiwania i na dole, jeśli chcę przeszukać przy pomocy "d", tym razem daje wynik, ale u góry strony, ale mój przewijanie znajduje się na dole strony. Tak, aby rozwiązać powyższy problem chcę ustawić pozycję przewijania w górnej części strony, gdy wyszukiwane jest pusty i wyświetla wszystkich klientów tak, co należy zrobić, aby rozwiązać ten problemJak przewijać na górze strony w jonowym

dzięki w adv ..

Odpowiedz

7

Dla Ionic 2 i wyżej użyć metody scrollToTop() od klasy zawartości.

page.html

<ion-content> 
    Add your content here! 
</ion-content> 

page.ts

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

@Component({...}) 
export class MyPage{ 
    @ViewChild(Content) content: Content; 

    scrollToTop() { 
    this.content.scrollToTop(); 
    } 
} 

Zobacz http://ionicframework.com/docs/api/components/content/Content/#scrollToTop

+2

To nie działa. Otrzymuję ten błąd - Runtime Error Nie można odczytać właściwości "scrollToTop" o wartości null –

0

Odpowiedź powyżej przewinie wszystkie swoje poglądy na górze. Jeśli chcesz mieć większą kontrolę, musisz użyć programu obsługi delegatów.

pierwsze, co chcesz, aby przewinąć trzeba będzie dodać nazwę Handler delegat

<ion-content delegate-handle="dashboard"> 
    ...... 
</ion-content> 

W kontrolerze trzeba będzie używać tego uchwytu

$timeout(function(){$ionicScrollDelegate.$getByHandle('dashboard').scrollTop(false);}); 

Polecam przy użyciu $ limit czasu ponieważ jeśli istnieje aktualny cykl trawienia, nie zadziała. Zmień także false na true, jeśli chcesz animować zwój. Na koniec nie zapomnij wstrzyknąć $ ionicScrollDelegate i $ limit czasu w kontrolerze

0

I zwykle to na mojej stronie głównej.

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

@Component({...}) 
export class MyPage{ 
    @ViewChild(Content) content: Content; 

    scrollToTop() { 
    this.content.scrollToTop(); 
    } 
    ionViewDidEnter(){ 
    this.scrollToTop(); 
    } 
} 

Możesz też wywołać funkcję scrollTop(), kiedy tylko chcesz.

Powiązane problemy