Angularjs inject provider into module factory function by string name for minification

Question

Angularjs inject provider into module factory function by string name for minification

I have the following code:

appModule = angular.module('appModule', []);

appModule.factory('sharedApplication', function($rootScope, $http) {
  var sharedApp;
  sharedApp = {};
  sharedApp.currentView = "home-section";
  sharedApp.pastEvents = null;
  $http.get('api/highlights').success(function(response) {
    return sharedApp.pastEvents = response.data;
  });
  return sharedApp;
});

This code works perfectly and as expected until I try to minify my javascript and then I get

    Error: Unknown provider: eProvider <- e

This is because the $http argument in my factory function has been renamed to 'e' for minification purposes. So how can I manually inform the appModule what to inject by name to avoid minification breaking my code?

Thanks in advance.

javascript
angularjs

Answer 1

Try

appModule.factory('sharedApplication', ['$rootScope','$http',function($rootScope, $http) {

}]);

regards

Answer 2

ng-annotate is also a good library so that the required dependency is injected automatically. You should check it out.

Code sample:

/* ngInject */
appModule.factory('sharedApplication', function($rootScope, $http) {
  var sharedApp;
  sharedApp = {};
  sharedApp.currentView = "home-section";
  sharedApp.pastEvents = null;
  $http.get('api/highlights').success(function(response) {
    return sharedApp.pastEvents = response.data;
  });
  return sharedApp;
});

Then you don't have to write:

appModule.factory('sharedApplication', ['$rootScope','$http', 
function($rootScope, $http) {
 var sharedApp;
 sharedApp = {};
 sharedApp.currentView = "home-section";
 sharedApp.pastEvents = null;
 $http.get('api/highlights').success(function(response) {
 return sharedApp.pastEvents = response.data;
});

return sharedApp;
}]);