angular - 按下后退浏览器按钮时忽略查询参数

Question

我的仪表板组件中有三个选项卡。单击任何选项卡时，url 会附加 queryParam 和选项卡信息(例如 root/dashboard?tab=tab1)。如果用户单击多个选项卡然后按下返回按钮，则会显示先前选项卡的 queryParams，这是正确的。

但是，我希望路由器忽略所有 queryParams 并导航到上一个路由(例如 root/profiles)。

如何在 Angular 中做到这一点？

Answer 1

在您的路由器链接上，您需要将 replaceUrl 属性设置为 true。这将导致点击的任何链接都将当前浏览器历史记录位置替换为当前链接。

<a [routerLink]="['./']" replaceUrl="true" [queryParams]="{tab: 'tab1'}">Tab1</a>
<a [routerLink]="['./']" replaceUrl="true" [queryParams]="{tab: 'tab2'}">Tab2</a>
<a [routerLink]="['./']" replaceUrl="true" [queryParams]="{tab: 'tab3'}">Tab3</a>