Routing to Named Angular Router Outlets | Task

Ole Ersoy
Nov - 07  -  1 min

Scenario

We want the path b to route to HelloBComponent inside the named router outlet o . This is the route configuration contained app.module.ts in within our Stackblitz demo.

const routes: Routes = [
{ path: 'a', component: HelloComponent },
{ path: 'b', outlet: 'o', component: HelloBComponent },
];

Approach

Configure the routerLink like this.

<button [routerLink]="[{ outlets: { o: ['b'] } }]">router link b</button>

Demo