2013-05-20 12 views
6

Po prostu uczenie się wtrysku zależności i myślę, że zaczynam to rozumieć.Zrozumienie wtrysku zależności w kontrolerach AngularJS

Proszę mi powiedzieć, czy jestem na dobrej drodze ...

Np .: Czy te dwa równoważne?

/* injection method */ 
function <controller_name>($scope) {} 
<controller_name>.$inject = ['$scope']; 

/* other method */ 
var app = angular.module('myApp'); 
app.controller(<controller_name>, function($scope) {}); 

Odpowiedz

12

Najpierw trochę wyjaśnienie:

Do wstrzykiwania zależności, to nie ma znaczenia, czy zadeklarować funkcję kontrolera przy użyciu globalnej lub jako argument module.controller(...) metody. Ingeror Dependency dotyczy tylko samej funkcji. Więc co ty właściwie pytając o to równoważność tych dwóch:

// First 

function MyController($scope) {} 

MyController.$inject = [ '$scope ']; 

// Second 

function($scope) {} 

A ponieważ kontroler czy funkcja jest anonimowa lub też nie, nie ma znaczenia dla wtryskiwacza, powyższe dwa może równie dobrze być:

// First 

function MyController($scope) {} 

MyController.$inject = [ '$scope ']; 

// Second 

function MyController($scope) {} 

teraz jest jasne, że jedyną różnicą pomiędzy swoimi dwoma kontrolerami jest obecność nieruchomości w jednym z nich $inject.

A oto rzeczywista odpowiedź na pytanie:

Te dwa kontrolery są prawie takie same. Oba otrzymają $scope jako argument i będą działać tak samo. Jeśli jednak później zdecydujesz się na minięcie kodu, tylko wersja z ustawioną na nim tablicą $inject będzie działać poprawnie. Dzieje się tak dlatego, że jeśli nie określisz tablicy $inject ani nie zastosujesz wbudowanego opisu adnotacji (http://docs.angularjs.org/guide/di#inlineannotation), jedyny sposób dla wtryskiwacza, aby dowiedzieć się, które zależności są interesujące, to sprawdzenie nazw argumentów funkcji (traktując je jako identyfikatory usług). Ale minifikacja nazwałaby te argumenty losowo, usuwając w ten sposób szansę rozpoznania zależności.

Jeśli chcesz zminimalizować kod, musisz wyraźnie określić zależności, korzystając z tablicy $inject lub adnotacji wbudowanej, w przeciwnym razie każda wersja będzie działać tak samo dobrze.

7

Jeśli masz zamiar użyć metody module.controller, odpowiednik do pierwszego przykładu byłoby:

var app = angular.module('myApp'); 
app.controller(<controller_name>, ['$scope', function($scope) {}]); 

Zauważ, że w ten sposób jesteśmy przechodzącej ciąg $inject wraz z funkcji, tak, że jeśli później zostanie zminimalizowany, nadal będzie działać.

+0

Dzięki, ale to nie działa z '$ http' ... zapytałem o to tutaj: http://stackoverflow.com/q/16664325 – user2283066