Question

目前，我正在尝试自动滚动到我在我的Typescript中使用的HTML页面的顶部。

 window.scrollTo(0 , 0);

并尝试自动向下滚动到HTML页面的底部

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

我正在尝试在HTTP响应后滚动顶部。

代码

 openPDFVievwer(data) {
  this.obj= JSON.parse(data._body);
  document.getElementById('spinner').style.display = 'none';
  window.scrollTo( 0 , 0);
}

当我在渲染另一个组件后尝试向下滚动时。

代码

searchData(data) {
    this.document = data;
    this.searchResultDiv = true; // where component will be rendered
    window.scrollTo( 0 , document.body.scrollHeight);
  }

但是，两者似乎都不起作用。

有什么我做错了吗？

Answer 1

尝试进入html

<div #list [scrollTop]="list.scrollHeight"></div>

解决方案2

在组件中将id定义为html id="scrollId"

const element = document.querySelector('#scrollId');
element.scrollIntoView();

Answer 2

以上解决方案对我不起作用，试试这个的码

public

Answer 3

角度2 +

的答案

这很简单，只需创建一个任意元素

例如 <span id="moveTop"></span>或仅添加ID 到元素中，或使用已经存在的ID，其中您必须将顶部，底部，中间 移动。

并在特定事件上添加此方法，例如我想在编辑列表列表时将顶部移到顶部。

 gotoTop() {

   var scrollElem= document.querySelector('#moveTop');
   scrollElem.scrollIntoView();  
  }

Angular 4 | window.scrollTo（）;工作不正常

3 个答案: