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

我发现了问题，并不是因为路由器配置，而是由于auth Guard服务执行了重定向。

Answer 2

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

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 3

像这样定义它

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

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

3 个答案: