2013-04-18 14 views
15

Welche Gründe gibt es, mehrere Controller in einer AngularJS-Anwendung zu haben? Ich habe jetzt ein paar eckige Apps gebaut und ich habe noch nie ein Problem festgestellt, bei dem ich dachte, dass mehrere Controller die Dinge für mich einfacher machen würden.AngularJS - Warum mehr als einen Controller haben

Ich bin immer noch ein bisschen wie ein n00b, habe noch nie einen Komponententest geschrieben und mein Code ist nicht so überschaubar, wie es sein könnte, also bin ich mir sicher, es ist einfach Ignoranz. Und ich habe gehört, dass andere Leute mehrere Controller haben.

Anders ausgedrückt: Woher weiß man, dass sie einen neuen Controller erstellen sollten?

Antwort

12

Von was ich gesehen habe, sollte eine Angular-Anwendung separate Controller für separate Bereiche haben. Zum Beispiel haben fast alle Anwendungen Benutzerdaten. Sie wollen diese Daten an ein Benutzermodell angebracht haben, in einem Benutzer-Controller:

function UserCtrl ($scope) { 
    $scope.user = { 
     name: "bmorrow", 
     lastLogin: "4/16/2013" 
    }; 
} 

Und die Vorlage (unsere Ansicht) in einem bestimmten Teil der Anwendungen Struktur sein wird. Zum Beispiel auf der rechten Seite einer Navigationsleiste oder auf einer Benutzerdetailseite. Wir stellen fest, wo dieser Teil ist, indem wir ihm einen Controller unter Verwendung von ng-controller zuweisen. Dies erzeugt die scope besagten Controllers und bindet die entsprechenden Modelle daran. Das Modell (unsere Daten) ist über den Controller mit der Ansicht (dem HTML) verbunden.

Angenommen, die Anwendung hat eine Seite für die geschriebenen Artikel des Benutzers. Wir können einen anderen Controller erstellen, der nur auf den HTML-Abschnitt beschränkt ist, der den Artikelinhalt enthält.

In dem trivialen Beispiel oben wird die Kombination beider Controller keinen Schaden anrichten. Aber sobald Ihre Anwendung zu wachsen beginnt, wird die logische Organisation Ihrer Controller/Views entsprechend den von Ihnen repräsentierten Daten Ihren Code sauberer und verständlicher machen. Weniger unnötige Komplexität macht alles viel einfacher für Sie. Und die Verwendung eines Controllers für alles ist eine unnötige Komplexität.

Sie können dies auch in Basarats Antwort illustriert sehen. Sie müssen nicht unbedingt einen Controller pro Route verwenden, aber dies hilft, die Anwendung logisch zu strukturieren.

Also, um Ihre Frage zu beantworten, sollten Sie normalerweise einen Controller pro Kategorie von Daten haben. Benutzer, Artikel, Obst, Gemüse, Transaktionen und so weiter.

Lesen Sie über Angular Controllers und die Model-View-Controller Muster für weitere Informationen, wenn Sie nicht bereits haben. Ich hoffe das hilft.

+1

Ich bin nicht sicher, ob Sie Daten in Ihrem Beispiel richtig verwenden. Die Daten sollten in der Fabrik gespeichert werden, die in eine Steuerung injiziert werden könnte. Sonst verschmutzt man den Controller und es wird zu einem riesigen Biest. – tylik

+0

Wie @tylik erwähnt, ist die Trennung von Bedenken wichtig. Für die Abfrage von Daten sollten Factories verwendet werden, da es viele Szenarien gibt, in denen ein Controller mehr als eine Datenkategorie benötigt. –

+0

In letzter Zeit habe ich viele Entwickler gesehen, die nur dann unterschiedliche Controller verwenden, wenn es absolut notwendig ist und die Probleme wie folgt lösen: '$ scope.app.user.name = ...' oder '$ scope.app.article.date = ... ', ich denke, es ist ein sehr praktischer Ansatz. – adelriosantiago

7

Sie fangen definitiv an, mehr Controller zu benötigen, wenn Sie beginnen, Ihre Anwendung in mehrere Ansichten zu teilen.

z.B. Wenn Sie mit der Verwendung von Routen beginnen (auch Deep-Linking genannt), haben Sie eine Vorlagen-URL sowie einen Controller, der mit dieser Vorlage verbunden ist (siehe http://docs.angularjs.org/tutorial/step_07), z.

angular.module('phonecat', []). 
    config(['$routeProvider', function($routeProvider) { 
    $routeProvider. 
     when('/phones', {templateUrl: 'partials/phone-list.html', controller: PhoneListCtrl}). 
     when('/phones/:phoneId', {templateUrl: 'partials/phone-detail.html', controller: PhoneDetailCtrl}). 
     otherwise({redirectTo: '/phones'}); 
}]); 
1

Ich denke gerne als Controller als "Widgets". Eine Seite meines Backends, sie können den ViewUsers Controller (Widget) öffnen, der mehr Controller UserDetail öffnen kann.

Ich denke, wenn Sie an OOP gewöhnt sind, fühlt es sich ziemlich natürlich an, ihre Bereiche getrennt und gekapselt zu halten.

Verwandte Themen