如何在删除查询参数后防止页面滚动到顶部？

17 浏览
0 Comments

如何在删除查询参数后防止页面滚动到顶部？

我已经设置了一个新的应用程序。当路由改变时（通常情况下），我希望页面滚动到顶部。

我已经像这样设置了我的app-routing：

@NgModule({
  imports: [
    RouterModule.forRoot(routes, {
      initialNavigation: "enabled",
      scrollPositionRestoration: "top",
      anchorScrolling: "enabled",
      scrollOffset: [0, 280], // [x, y] - 调整滚动偏移量
    }),
  ],
  exports: [RouterModule],
})
export class AppRoutingModule {}

但现在我有一个清除路由参数的按钮。我希望页面保持在当前位置，但它一直滚动到顶部。

我搜索了如何在不激活路由更改的情况下删除查询参数，找到了这个：

Angular: How to update queryParams without changing route

所以我做了这个：

public reset(e: MouseEvent): void {
  e.preventDefault();
  this.brandFilterService.reset();
  this.router.navigate([], {
    relativeTo: this.activatedRoute,
    queryParams: { query: null, id: null },
    queryParamsHandling: "merge",
  });
}

问题是，它仍然滚动到页面顶部。

有没有办法在不尝试滚动的情况下完成这个？

0