每当刷新页面时，滚动到HTML页面的顶部

Question

我和一个小问题斗争了几个小时。

我在Angular-9上工作，在HTML页面上，我有一个非常长的表(500行数据)。当我转到表格的底部，然后刷新页面时，它将位于页面的底部。而不是滚动到页面顶部。

但是每当我刷新页面时，页面应该转到HTML页面的顶部(表格的顶部)。

实际上，我已经搜索了很多谷歌的解决方案，但没有一个是工作。

你能建议一下如何解决这个问题吗？

Answer 1

将其添加到js文件中。

$(this).scrollTop(0);

Answer 2

如果你有一个标题组件，你可以直接尝试，或者在页面顶部创建一个带有id标题的空div，并将其粘贴到你的main函数中。

请确认ID，否则它将无法工作。

const header= document.getElementById('#header');
header.scrollIntoView();

Answer 3

在模板上，将模板变量添加到可滚动容器中，如下所示：

<div #myScrollableContainer>
   <!-- Here is your content that scrolls -->
</div>

在您的组件上，使用@ViewChild获取它，并在其上设置scrollTop。

@Component({ /*...*/ })
export class MyComponent {
   // pass the name of the template variable you picked with # on your template
   @ViewChild('myScrollableContainer') private myContainer:ElementRef<HTMLDivElement>;

   // Call this when you want to scroll to top
   public scrollToTopOfScrollable():void {
      this.myContainer.nativeElement.scrollTop = 0;
   }
}