Angular 2: How to use same child component with different data?

问题

I have a header that has menu consist of categories which they are the same component but different query. The first call from parent to child is executed perfectly but if i navigateto another category from inside this child component i get error!

I know this is something wrong with the link when i navigate inside this child which make [routerLink] updated instantly. Also if i navigate from category child component to login component which is separated component will give me the same error!

Note: Same question has been asked in this link with no answer

Nacim Idjakirene Question

Router configuration

const APP_ROUTES: Routes = [
  {path: 'landingpage', component: LandingpageComponent },
  {path: '', component: IndexComponent, children: [
        {path: '', component: HomeComponent},
        {path: 'category/:cate', component: CategoryComponent },
        {path: 'post/:id', component: PostComponent },
        {path: 'profile/:id', component: ProfileComponent }
      ] },
  {path: 'login', component: LogginComponent }

];

See the image

回答1:

Problem Solved by me after a deep search. i saw the response of a person called

brandonroberts: your router link is invalid and you either need to set a terminal route

and this solved my problem...

[routerLink]="['','category', cat.id]"

来源：https://stackoverflow.com/questions/42639655/angular-2-how-to-use-same-child-component-with-different-data