2013-04-18 14 views
15

Quali motivi ci sono per avere più controller in un'applicazione AngularJS? Ho creato alcune app angolari ora e non ho mai riscontrato un problema in cui pensavo che più controller avrebbero reso le cose più facili per me.AngularJS - Perché disporre di più di un controller

Sono ancora un po 'di n00b, non ho mai scritto un test unitario e il mio codice non è così maneggevole come potrebbe essere quindi sono sicuro che sia solo ignoranza. E ho sentito che altre persone hanno più controller.

In un altro modo: come si sa che dovrebbero creare un nuovo controller?

risposta

12

Da quello che ho visto, un'applicazione Angolare dovrebbe avere controller separati per ambiti separati. Ad esempio, quasi tutte le applicazioni hanno dati utente. Avrai voglia di avere questi dati collegato a un modello utente, all'interno di un controller utente:

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

E il modello (nostro punto di vista) sarà all'interno di una porzione specifica della struttura delle applicazioni. Il lato destro di una barra di navigazione, ad esempio, o su una pagina dei dettagli dell'utente. Stabiliamo dove è questa parte assegnandole un controller usando ng-controller. Ciò crea il scope di detto controller e associa i modelli corrispondenti ad esso. Il modello (i nostri dati) è connesso alla vista (l'HTML) tramite il controller.

Supponiamo che l'applicazione abbia una pagina per gli articoli scritti dell'utente. Possiamo creare un altro controller limitato solo alla sezione di HTML che contiene specificamente il contenuto dell'articolo.

function ArticleCtrl ($scope) { 
    $scope.article = { 
     title: "Hello World", 
     body: "Lorem ipsum...." 
    }; 
} 

Nel banale esempio precedente, la combinazione di entrambi i controller non causerà alcun danno. Ma una volta che la tua applicazione inizia a crescere, organizzare logicamente i tuoi controller/viste in base ai dati che rappresenta renderà il tuo codice più pulito e più facile da capire. Una minore complessità non necessaria renderà tutto più semplice con tutto. E usare un controller per ogni cosa è una complessità non necessaria.

Potete vedere questo illustrato nella risposta di Basarat pure. Non è necessario utilizzare un controller per rotta, ma farlo aiuta a strutturare logicamente l'applicazione.

Quindi, per rispondere alla tua domanda, di solito dovresti avere un controller per categoria di dati. Utenti, articoli, frutta, verdura, transazioni e così via.

Leggi informazioni su Angular Controllers e il modello Model-View-Controller per ulteriori informazioni se non l'hai già fatto. Spero che aiuti.

+1

Non sono sicuro di utilizzare correttamente i dati nell'esempio. I dati devono essere memorizzati in fabbrica e possono essere iniettati in un controller. Altrimenti inquinerai il controller e diventerà una bestia enorme. – tylik

+0

Come @tylik menzionato, la separazione delle preoccupazioni è importante. Le fabbriche dovrebbero essere utilizzate per interrogare i dati, perché ci sono molti scenari in cui un controllore può aver bisogno di più di una categoria di dati. –

+0

Ultimamente ho visto molti sviluppatori usare solo controller diversi quando è assolutamente necessario e fare la separazione di problemi come questo: '$ scope.app.user.name = ...' o '$ scope.app.article.date = ... ', penso che sia un approccio molto pratico. – adelriosantiago

7

Hai sicuramente bisogno di più controller quando inizi a dividere l'applicazione in più visualizzazioni.

ad es. Quando inizi a utilizzare i percorsi (chiamato anche deep linking) hai un modello di url e un controller per andare con quel modello (controlla http://docs.angularjs.org/tutorial/step_07) ad es.

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

Mi piace pensare come controller come "widget". Una sola pagina del mio back-end, possono aprire il controller ViewUsers (widget), che può aprire più controller UserDetail.

Immagino che se sei abituato a OOP, è piuttosto naturale voler mantenere i propri ambiti separati e incapsulati.

Problemi correlati