this.document.body.scrollTop = 0; this.router.routeReuseStrategy.shouldReuseRoute = function() { return false; }; /* Activated change detection for the title change */ this.router.events .filter((event) => event instanceof NavigationEnd) .map(() => this.activatedRoute) .map((route) => { while (route.firstChild) { route = route.firstChild; } return route; }) .filter((route) => route.outlet === 'primary') .mergeMap((route) => route.data) .subscribe((event) => { this.titleService.setTitle(event['title']); this.metaService.addTag(event['meta']); });
const appRoutes: Routes = [ { path: '', loadChildren: './main/pages/pages.module#PagesModule', data: { title: 'Home Page', meta: {name: 'description', content: 'hello its home'} } }, { path: '**', redirectTo: '/you-know-nothing-jon-snow' } ];
此外,我需要使用滚动到顶部的几个动态网址页面滚动到顶部每次点击。如果我删除routeReuseStrategy setTitle工作,并使用router设置标题,两者都不能一起工作,我绑定了其他选项,但它们中的任何一个在应用程序中都不能按预期工作。
这是一个黑客,但你可以尝试使用 setTimeout :
setTimeout
.subscribe((event) => { this.titleService.setTitle(event['title']); this.metaService.addTag(event['meta']); setTimeout(() => this.document.body.scrollTop = 0); });
顺便说一句,你也可以使用 window.scrollTo
window.scrollTo
window.scrollTo({ top: 0, behavior: "smooth" });