CODEWITHSUNDEEP
angularangular-ui-router
Le Duy Khanh
Le Duy Khanh

Reputation: 1369

Angular 5 router doesn't match when query params added

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 },
    ]
  }
];

It works well if I browse the exact route, but when I added the query params, says:

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

it will redirect back to sign-in route. How do I fix this?

Upvotes: 2

Views: 2401

Answers (3)

Le Duy Khanh
Le Duy Khanh

Reputation: 1369

I found out the issue, not because of router config, it's due to the auth guard service does the redirecting.

Upvotes: 2

Exterminator
Exterminator

Reputation: 1246

define it like this 

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

Upvotes: 0

Maksym Shevchenko
Maksym Shevchenko

Reputation: 746

Try to change your redirect route to something like this:

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' }
    ]
  }
];

UPDATE: added path:'' route

Upvotes: 0

Related Questions