在解析下一页 Angular 的数据之前触发导航结束

Question

我在做这样的事情

ngOnInit() {
this.router.events.subscribe((evt) => {
if (!(evt instanceof NavigationEnd)) {
return;
}
window.scrollTo(0, 0);
});

因为我想在每次用户导航时滚动到页面顶部。有趣的部分是在解析下一页的数据之前触发NavigationEnd。因此，它首先滚动到顶部(在同一页面上)，然后等待服务器(100毫秒左右)，然后显示新页面。这真的很奇怪。文档将NavigationEnd称为An event triggered when navigation ends successfully.导航结束不应该是下一页准备好显示后的最后一件事吗？

https://angular.io/guide/router#router-events

那么有谁知道我应该用什么来代替呢？

Answer 1

我知道这个话题有点旧，但从 Angular 6.x 开始，您可以使用：

RouterModule.forRoot(routes, {scrollPositionRestoration: 'enabled'})

在您的情况下，您可能希望将其设置为"top"。其他额外选项可在 https://angular.io/api/router/ExtraOptions

据我了解，导航结束是在重定向实际发生之前触发的。它包含请求的 url 和最终 url (urlAfterRedirects)，提供有关应用程序如何处理请求的信息。

Answer 2

实际上在引擎盖下它会触发几个 NavigationEnd 事件，因此您需要像这样指定您需要的确切url

!(val instanceof NavigationEnd && val.url !== '/home')

我们使用不同的策略。如果您log此事件，您将看到它在获取页面之前提供了很多事件。