Angular 1.5 rekursiv verschachtelte Komponente

Question

Ich suche so etwas wie ein erweitern Zusammenbruch mit Angular 1.5 Komponenten zu bauen. Die Idee ist, dass Sie eine oder mehrere davon in einer Reihe haben könnten, oder Sie könnten sie verschachteln, um einen Baum zu erstellen. So könnte gültige html wie folgt aussehen:

<expand-collapse title="This is my title"> 
    <p>This is my content</p> 
</expand-collapse> 

Oder

<expand-collapse title="Level 1 Title"> 
    <expand-collapse title="Level 2 Title"> 
     <p>This is my content</p> 
    </expand-collapse> 
</expand-collapse> 

Also, meine Frage ist, ob ich kann dies tun mit einer Angular 1.5-Komponenten (nicht-Richtlinie) in einer Weise, dass Der Expand-Collapse der Ebene 2 könnte sich seiner übergeordneten Expand-Collapse bewusst sein. Normalerweise, wenn Sie nisten Komponenten wie dieses Ich denke, würde man so etwas haben:

component('expandCollapse', { 
    ... 
    require : { 
     parentCtrl : "^expandCollapse" 
    } 
    ... 

jedoch A) Verschachtelung wird in diesem Fall nicht erforderlich ist, und B) parentCtrl endet eine nie endende rekursiven Verweis auf die aktuelle sein $ Strg.

ist etwas, das mit Komponenten kann getan werden? Oder wurde es aus irgendeinem Grund ausdrücklich verboten?

Answer 1

Ich sehe nur zwei Wege:

• eine Richtlinie für jede Ebene definieren die precendent Ebene erfordert, kann dies zu unnötigem Code führen.
• Suche Verwendung Winkelfunktionen: element.parent().controller('expand-collapse');. Dieser Ansatz wird normalerweise nicht empfohlen, aber ich sehe nichts einfacher/sauberer als das.