Angular 5 添加查询参数时路由器不匹配

Question

I have Angular 5 routes config like this: 
const loginRoutes: Routes = [
  {
    path: '',
    component: RegistationComponent,
    children: [
      { path: '', redirectTo: 'sign-in', pathMatch: 'full' },
      { path: 'sign-in', component: SigninComponent },
      { path: 'sign-up', pathMatch: 'prefix', component: SignupComponent },
      { path: 'twofactor', component: TwofactorComponent },
    ]
  }
];

如果我浏览确切的路线，效果很好，但是当我添加查询参数时，显示：

http://localhost:4200/login/reg/sign-up?inviteCode=b8f496ca68a37c174459

它将重定向回 sign-in 路线。我该如何解决这个问题？

Answer 1

尝试将您的重定向路由更改为如下内容：

const loginRoutes: Routes = [
  {
    path: '',
    component: RegistationComponent,
    children: [
      { path: 'sign-in', component: SigninComponent },
      { path: 'sign-up', pathMatch: 'prefix', component: SignupComponent },
      { path: 'twofactor', component: TwofactorComponent },
      { path: '', redirectTo: 'sign-in', pathMatch: 'full' },
      { path: '**', redirectTo: 'sign-in', pathMatch: 'full' }
    ]
  }
];

更新：添加了path:''路线

Answer 2

这样定义

  { path: 'sign-in/:invitecode', component: SigninComponent },

Answer 3

我发现了这个问题，不是因为路由器配置，而是因为 auth guard 服务进行了重定向。

Angular 5 添加查询参数时路由器不匹配

Angular 5 router doesn't match when query params added

angular

angular-ui-router