Meine Frage bezieht sich auf den Umgang mit komplexen Verschachtelungen von Vorlagen (auch genannt Teilbereiche ) in einer AngularJS-Anwendung.
Meine Situation lässt sich am besten mit einem Bild beschreiben, das ich geschaffen habe:
Wie Sie sehen können, kann dies eine ziemlich komplexe Anwendung mit vielen verschachtelten Modellen werden.
Die Anwendung ist einseitig, d.h. sie lädt eine index.html die ein div-Element im DOM mit der Eigenschaft ng-view Attribut.
Für Kreis 1 Sie sehen, dass es eine primäre Navigation gibt, die die entsprechenden Vorlagen in die Datenbank lädt. ng-view . Ich tue dies, indem ich die $routeParams zum Hauptmodul der Anwendung. Hier ist ein Beispiel dafür, was in meiner App enthalten ist:
angular.module('myApp', []).
config(['$routeProvider', function($routeProvider) {
$routeProvider.
when("/job/:jobId/zones/:zoneId", { controller: JobDetailController, templateUrl: 'assets/job_list_app/templates/zone_edit.html' }).
when("/job/:jobId/initial_inspection", { controller: JobDetailController, templateUrl: 'assets/job_list_app/templates/initial_inspection.html' }).
when("/job/:jobId/zones/:zoneId/rooms/:roomId", { controller: JobDetailController, templateUrl: 'assets/job_list_app/templates/room_edit.html' })
}]);Im Kreis 2 ist die Vorlage, die in die Datei ng-view hat eine zusätzliche Unternavigation . Dieses Sub-Navi muss dann Vorlagen in den Bereich darunter laden - aber da ng-view bereits verwendet wird, bin ich nicht sicher, wie man über dies zu tun gehen.
Ich weiß, dass ich zusätzliche Vorlagen in die erste Vorlage aufnehmen kann, aber diese Vorlagen werden alle ziemlich komplex sein. Ich möchte alle Vorlagen getrennt halten, damit die Anwendung leichter zu aktualisieren ist und keine Abhängigkeit von der übergeordneten Vorlage besteht, die geladen werden muss, um auf ihre Kinder zugreifen zu können.
Im Kreis 3 können Sie sehen, dass die Dinge noch komplexer werden. Es besteht die Möglichkeit, dass die Subnavigationsvorlagen eine 2. Unternavigation die ihre eigenen Vorlagen ebenfalls in den Bereich in Kreis 4
Wie kann man eine AngularJS-Anwendung so strukturieren, dass sie mit solch komplexen Verschachtelungen von Templates umgehen kann, während sie alle voneinander getrennt bleiben?
