Dynamically set router-outlet name
This is so frustrating. I really wish we could get a real solution. Here is my horrible hack, which works in this case because I only have three outlets: a, b, and c. My use case is that I have a three panel system with auxiliary urls and child routes. My "solution" would fall flat if I ever had a system where there was an arbitrary number of named outlets, or if the router outlet names could change dynamically.
What can we do to get on angular's case to get this fixed?
@Component({ selector: 'my-router-outlet', template: ` <router-outlet *ngIf="route.outlet === 'a'" name="a" ></router-outlet> <router-outlet *ngIf="route.outlet === 'b'" name="b" ></router-outlet> <router-outlet *ngIf="route.outlet === 'c'" name="c" ></router-outlet> `, changeDetection: ChangeDetectionStrategy.OnPush})export class RouterOutletComponent { constructor(public route: ActivatedRoute) {}}
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.