UI-Router: benannte Ansichten (mehrere) Ansichten, alles entkoppelt halten?

Question

Ich habe mit ui-Router gerade erst begonnen und ich schaffe Komponenten (Winkel 1,5) und unter Verwendung der neuen Komponentenmethode hier erklärt, obwohl es sollte keine Rolle spielen - http://angular-ui.github.io/ui-router/1.0.0-alpha.5/interfaces/ng1.ng1viewdeclaration.html#component

Ich glaube, ich muss auf absolut zu suchen und relative Ansichten für meine Staaten. Lassen Sie mich das Bild für mein Problem malen, wahrscheinlich besser mit einer Erklärung.

Ich habe eine Reihe von High-Level-Komponenten (mit Winkel 1,5 Komponenten). Einige der High-Level-Komponenten haben untergeordnete Komponenten, aber ich wollte diese Dinge nicht eng miteinander verbinden.

Wenn Sie also ein Beispiel für eine Suchkomponente verwenden, hängt diese Suchkomponente von einem Verlaufselement und einem gespeicherten Element ab. Sowohl Verlaufselemente als auch gespeicherte Elemente sind untergeordnete Komponenten. Gespeicherte Objekte haben außerdem 2 Kinder: Cloud-Objekte und lokale Objekte.

Also in der Suchkomponente wollte ich nicht fest zu den untergeordneten Komponenten koppeln, weil ich die Suchkomponente ohne die Kinder verwenden kann, also dachte ich über die Verwendung der relativen Ansicht.

konnte ich Platz 2 x

<div ui-view></div> 

in Suchkomponente und 2 x

<div ui-view></div> 

in gespeicherten Artikel.

Aber es fühlt sich einfach falsch an, ich bin nicht spezifisch eng mit bestimmten Ansichtsnamen gekoppelt, aber Suche Komponente erwartet 2 Kinder und gespeicherte Artikel würde auch 2 erwarten, dies kann nicht der Fall sein.

Ich würde wirklich jede Einsicht schätzen, die jemand anbieten kann.

Vielleicht überlege ich es und mache meine Komponenten zu klein? Aber ich wollte, dass sie besser zusammenstellbar sind und technisch kann die Suche ohne ihre Kinder existieren.

Hat jemand einige Beispiele oder Ratschläge?

Dank

Answer 1

Wenn ich Ihre Frage richtig verstanden habe, zu tun, was Sie wollen können, ist Ihre Mutterkomponente Richtlinie als Elementrestrict:'E' und fügen restrict:'A' dieser Richtlinie beschränken sie als Attribut als Attribut Kind Komponenten beschränken

und Verwendung Richtlinien Richtlinien und Verlinkungsfunktion Kind Richtlinien sollten

So Ihre endgültige Richtlinie so etwas wie diese

aussehen zu handhaben

<ui-view newattr1 newattr2></ui-view> 

wo ui-view Ihre übergeordnete Komponente und newattr1 sein wird, wird neuattr2 untergeordnete Komponenten sein. Wenn Sie in Ihrer <ui-view newattr1 newattr2></ui-view> entsprechenden Verknüpfungsfunktion der untergeordneten Komponente keine der untergeordneten Komponenten haben.

Answer 2

Eine Möglichkeit, dies zu tun (wenn ich die Frage richtig verstanden habe), obwohl es sich wie eine Umgehungslösung anfühlt, wäre, mehrere Komponenten zu erstellen, die viele der gleichen Logik teilen.

var setup = { 
    controller: searchController, 
    bindings: { 
    a: '=', 
    b: '<', 
    c: '@' 
    } 
}; 

angular.module('app') 
    .component('search', angular.extend(setup, { 
    templateUrl: 'search.html' 
    })) 
    .component('searchWithChildren', angular.extend(setup, { 
    templateUrl: 'search-with-children.html' 
    })); 

var searchController() { 
    ... 

Answer 3

Ich kann nicht Ihr Problem verstehen, aber von dem, was ich habe, können Sie eine Zwischenkomponente, die als Abstraktionsschicht wirken könnte.

Wenn Ihre Komponente nicht wirklich eng gekoppelt (und es scheint der Fall zu Ihrem Suchkomponente und Ihre Geschichte zu sein), können Sie einfach so etwas in Ihrem „higher level Komponente“ machen

<!-- We're inside an higher component with some data initialization --> 
<!-- passing data by references, this way both component use the same data --> 
<search-cmpt search-terms="searchTermsFromHigher"/> 
<history filter-terms="searchTermsFromHigher"/> 
<div ui-router></div> <!-- in which you resolve another component not tightly coupled --> 

Das Schlüsselproblem hier in meinem Sinne ist nicht, wie Sie Ihre Komponenten organisieren, sondern wie Sie Daten zwischen ihnen übertragen können. Habe ich recht ? Wenn dies der Fall ist, können Sie darüber nachdenken, Ihren Frontend-Status anders zu verwalten, als Sie tatsächlich tun.

NB: Es ist möglich, dass ich die Frage nicht richtig bekommen habe.

Answer 4

Ich würde weg von der Verwendung von Ansichten in Ihrer Suchkomponente bleiben. Andernfalls werden Sie seine Konsumenten zwingen, über ihre Zustände zu wissen, um ihre 2 Kinder zu aktivieren.

Ich habe den Eindruck, dass Sie es überdenken. Solange seine Kinder spezifisch sind, was bedeutet, dass sie nirgendwo anders verwendet werden, sehe ich nichts falsch darin, sie explizit in ihrer Elternkomponente zu deklarieren.