Question

我正在研究一个有角度的项目，我需要找出一种方法，当用户单击一个按钮时，该方法可以自动滚动到页面底部。

我尝试使用对我不起作用的jQuery函数animate（）进行此操作。我还尝试了以下功能：

scrollToBottom() {
  let myElement = document.getElementById("myPageId");
  myElement.scrollTop = myElement.scrollHeight;
}

此功能仅在我从html页面调用时有效，而当用户单击按钮时，我需要在ts文件中使用它。

Answer 1

创建一个按钮，该按钮执行@chestas和available here

编写的普通JavaScript

相关的 TS ：

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

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
})
export class AppComponent  {
  name = 'Angular';
  goToBottom(){
    window.scrollTo(0,document.body.scrollHeight);
  }
}

相关的 HTML ：

<button type="button" (click)="goToBottom()">go to bottom </button>

完成stackblitz

Answer 2

在这里Scroll Automatically to the Bottom of the Page查看答案这是代码，只需将其添加到函数scrollToBottom

window.scrollTo(0,document.body.scrollHeight);

单击按钮时，是否可以有角度地滚动到页面底部？

2 个答案: