FrozenHeart FrozenHeart - 2 months ago 10
AngularJS Question

How does AngularJS work with JS minifiers

How does dependency injection in AngularJS actually work?

Yeah, I read a lot of stuff and I know how to use it.

Suppose that we have the following controller:

app.controller('LoginCtrl', ['$scope', '$rootScope', '$http', '$location', function($scope, $rootScope, $http, $location) { /* ... */ }]);


I know that we should use pass an array to be able to use JS minifiers, so Angular will know real names of dependencies anyway.

Suppose that we actually use JS minifier and the
$scope
was traslated to
$s
. How will Angular know that this
$s
is actually a
$scope
so it should have the same interface as described in the
$scope
's documentation?

Answer

Minification process makes all names and parameters of function shorter to reduce the weight of files. So once your controller getting minified he will looks like this:

function(a, b, c, d) { /* ... */ }]);

But if you are using $inject, or pass array of injections with function, it will let your function know which exactly service should be injected to each of parameter into your controller.

app.controller('LoginCtrl', [
'$scope', '$rootScope', '$http', '$location', 
function(a, b, c, d) { /* ... */ }]);

So once it will be minified angular will still the names of services which should be injected and position number(index of element in array) each of them which is linked to index of parameter in controller function. So, as we see, order matters.