Wie findet Angular Auxiliary Router-outlet Tags zu verwenden?

Question

Während ich experimentierte mit Hinzufügen von Hilfsrouten zu meiner Anwendung für die Anzeige von Popup-Fenstern und Assistenten, hatte ich einige Probleme eckigen zu erkennen mein benanntes router-outlet-Tag. Ich hatte es innerhalb einer Komponente platziert, die war nicht zu geroutet wurde, sondern war nur innerhalb einer gerouteten Komponente. Jedes Mal, wenn ich versuchte, zur richtigen Route zu navigieren, erhielt ich eine Nachricht wie Cannot find router outlet popup.... Ich habe die router-outlet Ebene in der Komponentenhierarchie nach oben verschoben, und plötzlich funktionierte alles gut.

Also die Frage ist, wie genau analysiert eckig den Komponentenbaum, um router-outlet Tags zu finden, um eine Komponente hinzuzufügen?

Answer 1

Der Router-Ausgang registriert sich auf der übergeordneten RouterOutletMap (parentOutletMap), wenn es

https://github.com/angular/angular/blob/52be848f94a70feffd44a1d688286f750d0471d9/modules/%40angular/router/src/directives/router_outlet.ts#L52

@Directive({selector: 'router-outlet'}) 
export class RouterOutlet implements OnDestroy { 
    ...  
    constructor(
     private parentOutletMap: RouterOutletMap, private location: ViewContainerRef, 
     private resolver: ComponentFactoryResolver, @Attribute('name') private name: string) { 
    parentOutletMap.registerOutlet(name ? name : PRIMARY_OUTLET, this); 
    }