Steven Muhr Steven Muhr - 15 days ago 7
TypeScript Question

Dynamically set router-outlet name

Is it possible to dynamically set the name of a router-outlet in angular 2?
I need to create a generic component that contains a router-outlet.

Template example :

<nav class="nav menu">
<a *ngFor="let navRoute of navigationRoutes" class="nav-link" [class.selected]="navRoute.isActive" (click)="onActivated(navRoute.route)">{{navRoute.header}}</a>
</nav>
<router-outlet name=[[DO SOME BINDING HERE]]></router-outlet>


navigationRoutes & name are component @inputs

Answer

As far as I know this works since a while

<router-outlet [name]="propertyWithOutletName"></router-outlet>

There was an attempt to implement it but it wasn't completed.

https://github.com/angular/angular/pull/12550