Ионная прокрутка в нижней части страницы не работает

Question

Я использую Ionic 3. Когда пользователь нажимает на кнопку, он должен прокрутить вниз до нижней части страницы.Вот код, который я попробовал:

<div (click)='scrollDown()'>Change User Name</div>


<div>Now you can change your user name <div>

Логика:

 scrollDown() {
    window.scrollTo(0, 500);
  }

Answer 1

работал так,

@ViewChild(Content) content: Content;

  scrollToBottom() {
    setTimeout(() => {
      if (this.content.scrollToBottom) {
        this.content.scrollToBottom();
      }
    }, 400);
  }

Answer 2

используйте аннотацию @ViewChild внутри класса для содержимого. Затем используйте scrollToBottom () для содержимого, когда представление полностью загружено внутри функции тайм-аута, чтобы избежать сбоя в представлении.Пример кода:

export class exPage {
  @ViewChild(Content) content: Content;
  ionViewDidLoad() {
    setTimeout(() => {
      this.content.scrollToBottom(300);
    });
   }
 }

`

Answer 3

Вам нужно получить размер содержимого страницы, чтобы прокрутить его до нижней части.Ниже приведен пример прокрутки вниз по событию щелчка.

<div (click)='scrollDown()'>Scroll down</div>

.ts file

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

@Page({  
  templateUrl: 'page/page.html',
})



export class Page {

    @ViewChild(Content) content: Content;

     constructor() {
     }
     scrollDown(){
        let dimensions = this.content.getContentDimensions();
        this.content.scrollTo(0, dimensions.scrollBottom, 0);
    }
}