html - 如何在 ionic 内容中滚动到底部

Question

我们正在使用 Ionic v1.3.1 开发适用于 iPad 的移动应用程序。

在我们的一个页面中，ion-content 底部有一个 ul 元素。

当我们通过点击 ul 元素打开列表时，列表打开并且 ion-content 的高度发生变化但是内容不会向下滚动所以只要我们不这样做我们就看不到打开的列表'手动向下滚动。

我们尝试通过以下代码向下滚动到内容的底部。

代码正确获取内容，但 scrollToBottom 没有滚动到底部。

var element = document.getElementById("myContent");
if (element){
    element.content.scrollToBottom();
}

内容在页面中定义如下:

<ion-content id="myContent" class="padding has-header" scroll="true" style="overflow: scroll;">

有人知道怎么做才能让它发挥作用吗？ 任何帮助将不胜感激。

帕特里克

Answer 1

ES2015/ES6 样式滚动到底部

import {ViewChild} from 'angular2/core';
import {Page,Content} from 'ionic-angular';

@Page({  
  templateUrl: 'build/pages/page1/page1.html',
  queries: {
      content: new ViewChild(Content)
  }
})
export class Page1 {
     constructor() {
     }
     scrollToBottom(){
        let dimensions = this.content.getContentDimensions();
        this.content.scrollTo(0, dimensions.scrollBottom, 0);
    }
}

您可能需要添加:

@ViewChild(Content) content: Content;