Angular auxiliary route from child not loading component

Viewed 84

I have a route defined like this:

My app.component.html has 2 outlets:

<router-outlet></router-outlet>
<router-outlet name="modal"></router-outlet>

My route:

const routes: Routes = [
  { path: 'contents/:id', component: ContentComponent, children: [
    { path: 'edit', component: ContentFormComponent, outlet: 'modal' }
  ]},
];

The route (example) /contents/324231 loads fine with the ContentComponent. What I need to do is that the route /contents/324231/edit loads the ContentFormComponent inside the 'modal' outlet.

I tried to follow the examples, building a link:

<a [routerLink]="[ {outlets: { modal: 'edit' } } ]" >edit</a>

It gives the href: /contents/1/(modal:edit)

When I click in the link, the url changes to this but the component is not loaded (neither the constructor or ngOnInit method are called).

Any thoughts?

0 Answers
Related