在Angular中页面加载后页面自动滚动

Question

我必须在底部自动滚动页面

滚动代码

window.scrollTo({ left: 0, top: 20 * window.outerHeight, behavior: 'smooth' });

将它与click事件一起使用时，它工作得很好。

但是当我将该代码块放入构造函数时，它不起作用

this.activatedRoute.queryParams.subscribe(params => {
      let ref = params['ref'];
      console.log(ref); 
      if(ref=="subscription"){
        window.scrollTo({ left: 0, top: 20 * window.outerHeight, behavior: 'smooth' });
      }
    });

我做错什么了吗？

Answer 1

您也可以在“ NavigationEnd”路由器事件中进行处理。这是我们在app.component.ts中添加的代码块，并且可以正常工作

router.events.pipe(pairwise()).subscribe((event: [NavigationEnd, NavigationEnd]) => {
  if (event[0] instanceof NavigationEnd) {
    window.scroll(0, 0);
  }
}