Angular 2 kreisförmige Komponenten

Question

Ich versuche, circular abhängige Komponenten in angular2 arbeiten. Was bisher aus der Box funktioniert, ist rekursive Komponenten (die nicht so leicht in angular1 funktioniert hat):

@Component({ 
    selector: 'ace-view', 
    template: 
`<ace-view *ngFor="let SubView of SubViews" [view]="SubView"></ace-view>`, 
    directives:[ 
     AceViewComponent 
    ] 
}) 
export class AceViewComponent { 
... 
} 

Die Komponente oben setzt sich für Unter Ansichten gezeigt, die wie erwartet funktioniert.

Allerdings habe ich eine Situation, in der die Komponente A Komponente B benötigt und die Komponente B benötigt eine Komponente:

@Component({ 
    selector: 'ace-A', 
    template: 
`<ace-B *ngIf="whatever"></ace-B>`, 
    directives:[ 
     AceB 
    ] 
}) 
export class AceA {} 


@Component({ 
    selector: 'ace-B', 
    template: 
`<ace-A *ngIf="whatever"></ace-A>`, 
    directives:[ 
     AceA 
    ] 
}) 
export class AceB {} 

Dann ist das Problem, dass ACEB ist noch nicht definiert, wenn in den Richtlinien von ACEA verwendet. Schlimmer noch, AceA und AceB könnten sich in verschiedenen Dateien befinden.

• Was ist die richtige Lösung für diese Art von Wiederholungen?
• Kann ich dem Direktivitätsarray später zur Laufzeit eine Direktive hinzufügen?
• Wo finde ich den Quellcode des @component Dekorators und seine Implementierung (damit ich sehen kann, was es tut und versuche, es zur Laufzeit nachzuahmen)?

Answer 1

Sie würden forwardRef für diesen Anwendungsfall nutzen. In der Tat unterstützen ES6-Klassen das Heben nicht.

@Component({ 
    selector: 'ace-A', 
    template: ` 
    <ace-B *ngIf="whatever"></ace-B> 
    `, 
    directives:[ 
    forwardRef(() => AceB) 
    ] 
}) 
export class AceA {} 

(...)