Angular 9每次更改都会滚动到路线顶部

在 Angular 9 中，当路由发生变化时，页面会自动滚动到顶部

1. 打开 app.component.ts 文件。
2. 在文件的顶部，确保导入了 Router 和 ActivatedRoute： import { Router, ActivatedRoute } from '@angular/router';
3. 在 AppComponent 类的构造函数中，注入 Router 和 ActivatedRoute： constructor(private router: Router, private route: ActivatedRoute) {}
4. 在 ngOnInit() 生命周期钩子中，监听路由变化事件，并在路由发生变化时滚动到页面顶部： import { HostListener } from '@angular/core'; @HostListener('window:scroll', ['$event']) onWindowScroll(event) { if (event.target === document.documentElement) { document.documentElement.scrollTop = 0; } } ngOnInit() { this.router.events.subscribe((event) => { if (event instanceof NavigationEnd) { window.scrollTo(0, 0); } }); } 这里，我们使用 HostListener 监听窗口滚动事件，并在滚动时将页面滚动到顶部。同时，在 ngOnInit() 生命周期钩子中，我们订阅路由变化事件，当路由发生变化时，使用 window.scrollTo(0, 0) 将页面滚动到顶部。

现在，当路由发生变化时，页面会自动滚动到顶部。