Question

我具有在页面之间导航的路由器链接，并且使用

在url中发送参数

queryParamsHandling: "merge"

在某些情况下，我想从url中删除特定参数，但是我不想丢失所有参数。

我的网址看起来像： http://localhost:4200/school/440404?SelectedTab=1&UserName=bat7

路由之后，我想删除SelectedTab参数bun而不是UserName参数。

URL保留格式如下：

http://localhost:4200/school/440404?UserName=bat7

路由器代码位于不同的组件中，

包含执行该路线的后退按钮，使用后面的代码：

this.router.navigate([], { relativeTo: this.route, queryParamsHandling: "preserve" });

有什么想法吗？

Answer 1

角度允许两种类型的导航策略，一种是绝对路径，另一种是第二个是相对路径。

使用绝对路径策略，我们需要在组件级别编写硬代码路径。
使用相对路径策略，我们只需要编写路径级别的路径即可。

有关问题的解决方案，请按照以下步骤操作。

步骤1：声明路由

const routes: Routes = [
  { path: '', redirectTo: '/school', pathMatch: 'full' },
  { path: 'school', component: DashboardComponent },
  { path: 'school/:SelectedTab/:UserName', component: SchoolComponent },
];

第2步：在第一个部分中说明上学的方法，如下所示。然后您会得到类似

的网址

例如http://localhost:4200/school/1/sa

goToSchool() {
    let object: any = {};
    object.SelectedTab = 1;
    object.UserName = 'sa';
    this.router.navigate([object.SelectedTab, object.UserName], { relativeTo: this.route});
  }

步骤3：然后放学回去，您需要修改以下代码，以仅获取UserName

 GoBackFromSchool() {
    this.router.navigate(['../../'], { relativeTo: this.route, queryParams: { UserName: 'sa' } });
  }

例如：http://localhost:4200/school?UserName=sa

使用查询参数的角度6中的路由器链接

1 个答案: