2017-04-01 81 views
8

我有2個滾動視圖的頁面彼此相鄰:Ionic2 - 編程滾動離子滾動

<ion-content> 
    <ion-scroll></ion-scroll> 
    <ion-scroll></ion-scroll> 
</ion-content> 

我想以編程方式滾動第一個,但它似乎scrollTo只是一個方法離子含量(我當然不能滾動,我需要有第二個獨立)

有沒有什麼辦法解決這個問題?

更新:加入a plnkr顯示什麼,我需要

回答

2

如果我沒有記錯,你試圖滾動左側滾輪,我看到你有一個觀點叫選擇leftCats

所以,如果你只是改變一條線,你將能夠滾動。這裏是我的代碼如下:

注意:這只是普通的javascript。它跳轉到滾動位置。如果您以後喜歡,可以應用動畫。

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

@Component({ 
    templateUrl:"home.html" 
}) 
export class HomePage implements AfterViewChecked { 

    @ViewChild('content') content; 
    @ViewChild('leftCats') leftItems; 

    constructor() { 

    } 

    scroll() { 
     //I want to scroll the left pane here 
     console.log('scroll'); 

     this.leftItems.scrollElement.scrollTop += 50; // Change This Line 
    } 

} 

我也分叉在這裏:DEMO

希望它能幫助。

+0

完美!謝謝! –

+0

任何想法在哪裏開始動畫這個? –

+1

找到了。對於其他的參考:http://stackoverflow.com/questions/8917921/cross-browser-javascript-not-jquery-scroll-to-top-animation –