$ anchorScroll in Ionic 2？滾動到元素ID

任何方式做Angular2離子2/Angular2 $ anchorScroll？

嘗試滾動到頁面上的元素。我想是這樣NG2頁面滾動 https://github.com/Nolanus/ng2-page-scroll

不確定是不是我做的是正確的，我也跟着通過教程，並得到了錯誤：

ParseError: 'import' and 'export' may appear only with 'sourceType: module'

我認爲，隨着最新的離子2不工作釋放了。只希望有一個更簡單的方法來做到這一點，任何解決方法？

來源

2016-07-28 adrian li

我處於相同的情況，我想每次點擊一個按鈕時滾動到下一頁/元素。

我看着你提到的相同的選項，我發現在離子幻燈片（http://ionicframework.com/docs/v2/api/components/slides/Slides/）中，您可以將方向設置爲「垂直」，這對我來說是個訣竅。

不知道它是否可以幫助您的用例。

否則，您可以查看Content和scrollTo函數。 http://ionicframework.com/docs/v2/api/components/content/Content/

來源

2016-08-11 11:05:57 georgibakken

不過我用* ngFor處理了很多JSON信息，使用幻燈片會導致性能問題。但我想你的答案是我們與ionic2最接近的解決方法。 scrollTo只適用於我，當我使用它存儲和加載「上次查看」的滾動位置...因爲它不能獲得元素的位置，不同設備/屏幕尺寸上的流體佈局會打敗目的......但thx的建議。 –

我不知道你是否仍然面臨這個問題，但是這可以通過YourHTMLelement.getBoundingClientRect()來解決，它返回那個元素的頂部，右邊，底部和左邊界。

與此同時，您可以使用content和scrollTo(left, top, duration)函數。我創建了一個功能，垂直滾動到一個特定的元素，它看起來像：

scrollToElement(id) { 
    var el = document.getElementById(id); 
    var rect = el.getBoundingClientRect(); 
    // scrollLeft as 0px, scrollTop as "topBound"px, move in 800 milliseconds 
    this.content.scrollTo(0, rect.top, 800); 
}

但你可以改變它，你也想水平滾動方式，與scrollLeft參數。

來源

2016-10-03 03:01:16

我遇到了'el.getBoundingClientRect（）'問題，給出了不可靠的結果。一個簡單的'el.offsetTop'爲我做了訣竅。 –

$ anchorScroll in Ionic 2？滾動到元素ID

回答

相關問題