How to configure child routes properly?Error: Uncaught (in promise): Error: Cannot match any routes. URL Segment: 'parent/child1

Question

I am getting the following error after configuring child routes.

Error: Uncaught (in promise): Error: Cannot match any routes. URL Segment: 'parent/child1

app.routing.ts

{ path: 'home', component: homeComponent},
  { path: 'about', component: aboutComponent},
  { path: 'parent', component: parentComponent,
    children:[
    {
      path: '',
      redirectTo: '/parent/child1',
      pathMatch: 'full'
    },
    {
      path: 'child1',
      component: child1Component,
      outlet: 'subRouter'
    },
    {
      path: 'child2',
      component: child2Component,
      outlet: 'subRouter'
    }]
  },
{ path: '**', redirectTo: 'home', pathMatch: 'full' }

In my index.html, I have <router-outlet></router-outlet>

In my parent.htm(parentComponent) I have <router-outlet name="subRouter"></router-outlet>

What am i missing? Why i am getting that error? How can i resolve this error?

Pankaj Parkar · Answer 1 · 2017-06-01T08:00:46.060

0

The parent route children '' path redirection should changed to below, and explicitly mention outlet:component value.

redirectTo: '/child1(subRouter:child1)'

Because /parent will be implicitly included as you're redirecting from child route.

edited Jun 01 '17 at 08:00

answered Jun 01 '17 at 07:47

Pankaj Parkar

134,766
23
234
299

After making this change i am getting the same error with URL Segment: 'child1' – Keshav1007 Jun 01 '17 at 07:52
Nope. Still getting the same error. After specifying the outlet and component value – Keshav1007 Jun 01 '17 at 08:07

How to configure child routes properly?Error: Uncaught (in promise): Error: Cannot match any routes. URL Segment: 'parent/child1

1 Answers1