角 10 |如何在 routerLink 中使用多个路由器参数

【问题标题】：Angular 10 | how to user multiple router params in routerLink角 10 |如何在 routerLink 中使用多个路由器参数
【发布时间】：2021-08-14 07:29:46
【问题描述】：

我正在尝试在 routerLink html 中使用我的路由参数但问题是路线只有这样的参数

const routes: Routes = [
  {
    path: '',
    component: HomeComponent
  },
  {
    path: ':user',
    component: UserComponent
  },
  {
    path: ':page',
    component: PageComponent
  }
];

所以，当我像这样在 html 中将 routerLink 用于PageComponent 时

<a [routerLink]="[data]">John</a>

它总是去第一条路线UserComponent

【问题讨论】：

标签： angular

【解决方案1】：

你不能同时拥有 ':user' 和 ':page' 因为你告诉 Angular 存在两条类似“/yourparam”的路由，当然 Angular 不知道如何处理它们，因此总是给你第一个。

你可以这样做：

const routes: Routes = [
  {
    path: '',
    component: HomeComponent
  },
  {
    path: 'user/:user',
    component: UserComponent
  },
  {
    path: 'page/:page',
    component: PageComponent
  }
];

如果你愿意，你也可以设置子路由。

【讨论】：