0

I am trying to implement a component with children compents using router-outlet tag and routerModule from Angular.

The issue with the angular RouterModule. For some unknown reason, having more than 2 children for a parent component does not work. In my case, the 3rd link is simply not working and if I open chrome console, the link it tries to navigate to is not localhost:4200 but localhost:8080.

If I change the order, then one of them will simply not work.

RouterModule.forChild([
        { path: '', component: MainComponent, canActivate: [AuthGuard]},
        { path: 'project',
            component: MainComponent,
            children : [
                {
                    path: ':id/:qid',
                    component: DataComponent
                },
                {
                    path: ':id',
                    component: ProjectComponent
                },
                {
                    path: 'search',
                    component: SearchComponent
                },
            ]
        }
    ])

This is an image of what I'm getting in chrome console. It is not supposed to reach out at the server. Chrome console server response error

Nesan Mano
  • 1,892
  • 2
  • 26
  • 43
  • would you please a stackblitz for your question – Reza Aug 14 '19 at 19:37
  • I simply tried to change order and it started working. Very fishy, why it did not work from the beginning. This question is still to be solved. I will post the stackblitz later tonight – Nesan Mano Aug 14 '19 at 20:27
  • I guess if you add `pathMatch: 'full'` to your first route it was working too, this is why I asked you to create stackblitz to not guess ;) – Reza Aug 15 '19 at 13:15

0 Answers0