Question

我的仪表板组件中有三个选项卡。单击任何选项卡后，url后面将附加带有选项卡信息的queryParam（例如root/dashboard?tab=tab1）。如果用户单击多个选项卡，然后按返回按钮，则正确显示了先前选项卡中的queryParams。

但是，我想让路由器忽略所有queryParams并导航到上一条路线（例如root/profiles）。

如何在Angular中执行此操作？

Answer 1

签出skipLocationChange属性。

您可以在此处找到文档：https://angular.io/api/router/NavigationExtras

// Navigate silently to /view
this.router.navigate(['/view'], { skipLocationChange: true });

这可以防止将路由添加到历史记录中，因此不会在后退按钮使用的历史记录列表中。

Answer 2

在路由器链接上，您需要将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>

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

2 个答案: