AngularJS mehrere templates in einer Seite
Habe ich einen index, dient eine statische header-Menü, und unten, dass eine ng-view, basierend auf der route, wählt die passende Vorlage. Wie diese zum Beispiel:
<navbar>
...
</navbar>
<div ng-view>
</div>Alles ist gut so weit, wenn Sie eine bestimmte route zu einem Treffer, eine Vorlage geladen wird, die container mit den zugehörigen controller.
Nun, ich habe eine andere Seite geladen innen ng-view, und es wird ausgelöst, wenn die url "/dashboard" ist der hit. Das problem ist, dass die dashboard-Seite hat eine sidebar-Menü, dass muss auch enthalten einige routing-Logik (mehr oder weniger). Wenn ein link angeklickt wurde aus der sidebar-Menü, dass ich zum laden nur die linke Seite (nicht die ganze ng-view-container).
Habe ich identifizierte zwei Lösungen:
1) Erstellen Sie eine Richtlinie, die speichert, sidebar-Menü, und injizieren es in alle Seiten, erfolgt durch das sidebar-Menü, ==> routing ist immer noch behandelt von ng-view.
2) mit ng-include und haben einige routing-Logik auf der dashboard-Seite wie diese:
<a ng-click="templateType = 1">Template 1</a>
<a ng-click="templateType = 2">Template 1</a>
<div ng-if="templateType === 1" ng-include="template1"
ng-controller="Template1Controller"></div>
<div ng-if="templateType === 2" ng-include="template2"
ng-controller="Template2Controller"></div>Gibt es einen anderen Ansatz? Oder was ist die beste Praxis im Umgang sowohl eine Seitenleiste, die Griffe einige Routen, und ein statisches Menü, mit der anderen Routen, mit der Erwähnung, dass das sidebar-Menü ist nur verfügbar auf einigen der Routen.
Habe ich eine paint Zeichnung, in der Hoffnung, dass ich erklären kann mein problem besser.
Außerdem können Sie überprüfen, angular-route-segment aus.
Ich dachte, vielleicht gab es eine eingebaute Lösung, ohne das hinzufügen von weiteren externen Abhängigkeiten
Sie haben hacken an viele viele Orte, um dies zu erreichen. Obwohl, mit angular-ui-router, Ihr Leben wird einfach und glatt. Es bietet eine Menge Flexibilität.
angular-ui-router scheint wie eine wirklich gute Lösung, aber mit wäre es erforderlich zu überdenken, alle komplexen routing, der bereits in der Anwendung. Es wäre schön gewesen, wenn ich verwendet hätte es seit dem Beginn des Projekts.
InformationsquelleAutor Rus Paul | 2015-06-11
Du musst angemeldet sein, um einen Kommentar abzugeben.
Können Sie mit UI-Router und geben Sie einen Schuss auf verschachtelte Ansichten. Hier ist ein wirklich gutes tutorial. Ich denke, was Sie zu erreichen versuchen, ist schon erwähnt, am Ende des Tutorials.
UI-Router ist nicht so Verschieden von ngRouter. Es ist der Umgang mit Mitgliedstaaten, die gegen die Routen, routeParams werden stateParams und ui-view-ersetzt original-ng-view-Direktive. Dann können Sie den Verweis auf Ihre Strecken mit ui-sref (wirklich nützlich) oder einfach mit href. Aber ich verstehe Ihren Standpunkt. Ich denke, dass Sie verwenden können, ngRoute-Parameter zu bestimmen, welche sub-Elements anzeigen, aber es kann ein bisschen komplexer. 🙂
UI-Router scheint wirklich nett, aber die meine app hat ~150 verschiedene Routen verteilt über viele Module und es würde ändern jeder einzelne von Ihnen, um UI-Router-Implementierung. An diesem Punkt würde ich eher eine Richtlinie für eine sidebar und ich Spritzen es überall wo ich es brauche.
Ja, natürlich. Können Sie erwägen, mit ui-router in Ihrer kommenden Projekte. Gutes Glück mit diesem. Hoffe, Sie bekommen die Antwort, die Sie suchen.
InformationsquelleAutor Freezystem
Als alle andere haben vorgeschlagen, die Sie brauchen, um zu gehen, für die UI-router und verschachtelte Ansichten. Es ist eine großartige Möglichkeit, um Ihre Seite-layout.
Können Sie die Antwort finden
Angular-UI-Router erstellen Sie ein "layout" - Zustand?
InformationsquelleAutor Hacker