AngularJs $ scope undefined, gdy kontrolery znajdują się w module

Question

Próbuję użyć szablonu z ziarnami kątowymi z domyślnymi ustawieniami. W controllers.js używam

angular.module('myApp.controllers', []). 
    controller('MyCtrl1', [function($scope) { 
     $scope.test = 'scope found!'; 
    }]) 
    .controller('MyCtrl2', [function() { 

    }]); 

Tam $scope zawsze jest niezdefiniowany. Kiedy wyjmę sterownik z modułu i zarejestruję go globalnie, działa dobrze. Jak tutaj:

function MyCtrl1($scope) { 
    $scope.test = "scope found!"; 
} 
MyCtrl1.$inject = ['$scope']; 

Czy ktoś mógłby mi wyjaśnić, dlaczego tak jest?

Answer 1

Nie można mieszać takich rzeczy. Musisz wybrać jedną z dwóch możliwości:

app = angular.module('test', []); 

// possibility 1 - this is not safe for minification because changing the name 
// of $scope will break Angular's dependency injection 
app.controller('MyController1', function($scope) { 
    // ... 
}); 

// possibility 2 - safe for minification, uses 'sc' as an alias for $scope 
app.controller('MyController1', ['$scope', function(sc) { 
    // ... 
}]); 

Nie polecam używania innej składni, która bezpośrednio deklaruje kontroler. Wcześniej czy później wraz z rozwojem twojej aplikacji będzie trudno ją utrzymać i śledzić. Ale jeśli trzeba, istnieją 3 możliwości:

function myController1 = function($scope) { 
    // not safe for minification 
} 

function myController2 = ['$scope', function(sc) { 
    // safe for minification, you could even rename scope 
}] 

var myController3 = function(sc) { 
    // safe for minification, but might be hard 
    // to read if controller code gets longer 
} 
myController3.$inject = ['$scope']; 

Answer 2

Byłem też szukając tej jednej, wydaje się, że trzeba wpisać '$scope' przed funkcji, jak poniżej:

angular.module('myApp.controllers', []). 
    controller('MyCtrl1', ['$scope', function($scope) { 
     $scope.test = 'scope found!'; 
    }]) 
    .controller('MyCtrl2', ['$scope',function() { 

    }]); 

To umila poczucie, myślę, że powinno być bardziej jasne, chociaż ..

Answer 3

to jest właściwy sposób:

angular.module('myApp.controllers', []); 

angular.module('myApp.controllers').controller('MyCtrl1', ['$scope', function($scope) { 

}]); 

Answer 4

Możesz po prostu usunąć "[" i "]", gdy używasz $ scope.

angular.module('myApp.controllers', []). 
 
controller('MyCtrl1', function($scope) { 
 
    $scope.test = 'scope found!'; 
 
    }) 
 
    .controller('MyCtrl2', [ 
 
    function() { 
 

 
    } 
 
    ]);