2015-09-09 7 views
12

zur Zeit arbeite ich in ionischen Rahmen auf Javascript und eckig-js ich nur das Suchfeld und render Liste der Kunden, aber nehme an, im ersten Versuch kann ich mit 'a' es suchen zeigt alles, was Alpha 'a' hat, aber das Problem ist, wenn ich scrolle, um die Suchergebnisliste zu sehen, und unten, wenn ich diesmal mit 'd' suchen will, gibt es das Ergebnis, aber oben auf der Seite, aber meine scrollen befindet sich am Ende der Seite. So das obige Problem zu lösen i an der Spitze wollen der Seite gesetzt Scroll-Position, wenn Suchabfrage leer ist und alle Kunden anzeigen, so was sollte ich dieses Problem zu lösen, tunWie scrolle ich oben auf der Seite in ionic

dank adv ..

Antwort

7

Für Ionic 2 und höher verwenden, um die scrollToTop() Methode auf der Content-Klasse.

seite.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(); 
    } 
} 

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

+2

Dies funktioniert nicht. Ich erhalte diesen Fehler - Laufzeitfehler Kann die Eigenschaft 'scrollToTop' von null nicht lesen –

0

Die Antwort oben alle Ihre Ansichten nach oben scrollen. Wenn Sie mehr Kontrolle haben möchten, müssen Sie einen Delegate-Handler verwenden.

Erste, was Sie blättern möchten haben Sie die Delegierten Handler Name

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

In Ihrem Controller hinzuzufügen, werden Sie diese Prozedur zu verwenden, haben

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

ich empfehlen würde ein $ timeout mit denn wenn es einen aktuellen Digest-Zyklus gibt, wird es nicht funktionieren. Ändern Sie auch false zu true, wenn Sie die Rolle animieren möchten. Schließlich vergessen Sie nicht $ ionicScrollDelegate und $ timeout in Ihrem Controller

0

ich normalerweise diese auf meiner Homepage zu injizieren.

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(); 
    } 
} 

Oder Sie können scrollTop() aufrufen, wann immer Sie möchten.

Verwandte Themen