イオンのページの上部をスクロールする方法

Question

現在、私はjavascriptとangular-jsのionic frameworkで作業しています。私はちょうど検索ボックスを置き、顧客のリストを表示しますが、最初の試みでは 'a'アルファ 'a'を持つすべてのアイテムを表示しますが、問題は検索結果のリストを表示するためにスクロールして、下の方に 'd'で検索したい場合は結果が表示されますがページの上部に表示されますスクロールはページの一番下にあります。だから、私はこの問題にADVで

感謝を解決するために何をすべき検索クエリが空になったとき、私は、ページの上部にセットスクロール位置をしたい上記の問題を解決し、すべての顧客を表示する ..

Answer 1

ます試すことができます：

イオン2については

$ionicScrollDelegate.scrollTop(); 

http://ionicframework.com/docs/api/service/$ionicScrollDelegate/

Answer 2

と高いコンテンツクラスにscrollToTop()メソッドを使用します。

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

は、上記の答えがトップにすべてのあなたの意見をスクロールしますhttp://ionicframework.com/docs/api/components/content/Content/#scrollToTop

Answer 3

を参照してください。より多くの制御が必要な場合は、デリゲートハンドラを使用する必要があります。

まずあなたがスクロールしたいものは何でも、あなたは、デリゲートのハンドラ名をあなたのコントローラで

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

を追加する必要がありますあなたが

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

このハンドラを使用する必要があります私は$タイムアウトを使用することをお勧めします現在のダイジェストサイクルがあれば動作しません。スクロールをアニメートする場合は、false〜trueも変更してください。最後に、私は通常、この私のホームページ上の

Answer 4

あなたのコントローラに$ ionicScrollDelegateと$タイムアウトを注入することを忘れてはいけません。

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

または、必要に応じてscrollTop（）を呼び出すことができます。