javascript - Why we Inject our dependencies two times in angularjs?

Question

I'm new in angular, want to know why and when we should inject all our needed dependencies two times.

Example :

var analysisApp=angular.module('analysisApp',[]);

analysisApp.controller('analysisController',function($scope,$http,$cookies,$state,globalService){   

});

But we can also write the above code as :

var analysisApp=angular.module('analysisApp',[]);

analysisApp.controller('analysisController',['$scope','$http','$cookies','$state','globalService',function($scope,$http,$cookies,$state,globalService){ 

}]);

Why ?

Answer 1

This is to make the app minsafe.

Careful: If you plan to minify your code, your dependency names will get renamed and break your app.

When you will(or may), minify all the files, the dependencies are replaced by the words like a, b, ... etc.

But, when you use array and string like syntax, as shown in the second snippet, the string are never minifies and can be used for mapping. So, the app knows that a is $scope(See below example).

Example:

// The minified version
var _ = angular.module('analysisApp', []);

_.controller('analysisController', ['$scope', '$http', '$cookies', '$state', 'globalService', function (a, b, c, d, e) {
    a.name = 'John Doe'; // Now a here is `$scope`.
}]);

See Angular Docs

Here is nice article for making your app minsafe with Grunt.

For minification best practices: Angularjs minify best practice