0

在 Angular 4 中,当路由器更改时,页面不会滚动到顶部。

我的解决方案是用#top 放置一个div,在打字稿中我使用ViewChild 来像scrollIntoView

<div #top></div>

import { ViewChild, ElementRef } from '@angular/core';

@ViewChild('top') top: ElementRef;

当启动并加载我需要的所有内容时,我会打电话

this.top.nativeElement.scrollIntoView();

这适用于 PC,但在移动设备中,清晰度标题隐藏 ( <clr-header>),当我用移动设备滚动顶部时,滚动标题再次显示,但给用户带来不好的体验,我希望每次都显示标题。

请记住,标头位于根目录上,并且所有嵌套路由都在“路由器出口”内,因此我在嵌套路由中滚动顶部的解决方案不适用于根目录。

我尝试在 root 中使用此命令,但不起作用,“滚动顶部”仅在嵌套路由中工作。

我已经尝试过以下命令:

window.scrollTo(0, 0)不工作

document.body.scrollTop = 0不工作

this.document.body.scrollTop = 0(使用 Angular DOCUMENT 模块)不起作用

还有许多其他人......有人可以帮忙吗?

4

1 回答 1

0

尝试

window.pageYOffset || document.documentElement.scrollTop ||document.body.scrollTop || 0

这将涵盖所有浏览器并且应该可以工作。

于 2018-01-09T13:36:40.330 回答