Wann ist eine Richtlinie in den Komponentenmetadaten in Angular2 erforderlich?

Question

Im Winkel Tutorial hier: https://angular.io/docs/ts/latest/tutorial/toh-pt3.html

die HeroDetailComponent wird als eine Richtlinie zu app.component.ts hinzugefügt:

@Component({ 
    selector: 'my-app', 
    //... 
    directives: [HeroDetailComponent] 
}) 

Das Tutorial sagt: „Ein Browser-Tags HTML ignoriert und Attribute, Es erkennt nicht. Auch Angular ... Wir erzählen Angular darüber (die HeroDetailComponent), indem wir es im Array metadata directories auflisten. "

jedoch in dem Arbeitsbeispiel hier: https://github.com/DeborahK/Angular2-GettingStarted (siehe APM - Finale aktualisiert Projekt)

app.component.ts lädt eine Komponente namens ProductDetailComponent noch keine Richtlinie für sie hat:

@Component({ 
    selector: 'pm-app', 
    //... 
    directives: [ROUTER_DIRECTIVES],  
}) 

Warum kann das zweite Beispiel ProductDetailComponent ohne eine ProductDetailComponent-Direktive laden?

Answer 1

Von dem, was ich sehen kann, AppComponent Importe ProductDetailComponent sondern nutzt es über <router-outlet> seit ProductDetailComponent in @Routes definiert. Diese

bedeutet, dass <router-outlet> definiert nur, wo die Komponenten werden angezeigt, wenn Sie sich entscheiden, sie zu navigieren (was in diesem Fall passiert, den Code <a [routerLink]="['/product', product.productId]"> in Produkt-list.component.html Ausführung).

ProductListComponent definiert keine selector und konnte daher nicht innerhalb der Vorlage einer anderen Komponente referenziert werden.

Eine Komponente muss in ihren Direktiven die Komponenten/Direktive definieren, auf die in ihrer Vorlage über ihre Selektoren verwiesen wird.

Ich hoffe, das hilft