0

I am trying to inject a service in app.config as illustrated in Inject service in app.config. However, minification breaks the app. How to overcome this?

This doesn't work with minification:

app.config(['$routeProvider',function ($routeProvider) {
    $routeProvider
        .when('/',
        {
            templateUrl: "partials/editor.html",
            controller: "AppCtrl",
            resolve: {
                       //Following method doesn't work with minification
                        data: function (dbService) {
                                 return dbService.getData();
                              }
                     }
        })
}]);
Community
  • 1
  • 1
Shyamal Parikh
  • 2,988
  • 4
  • 37
  • 78

3 Answers3

1

You need to inject it using the inline array annotation as stated in the angular docs.

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

As stated in the docs,

someModule.controller('MyController', ['$scope', 'greeter', function($scope, greeter) {
  // ...
}]);

In your case,

app.config(['$routeProvider', function ($routeProvider) {
    $routeProvider
        .when('/',
        {
            templateUrl: "partials/editor.html",
            controller: "AppCtrl",
            resolve: {
                       //Following method doesn't work with minification
                        data: ['dbService', function (dbService) {
                                 return dbService.getData();
                              }]
                     }
        })
}]);

Referenced from here: Angularjs: Inject Service in app.config such that to safeguard against minification

Community
  • 1
  • 1
Code Apprentice
  • 522
  • 2
  • 7
  • 19
  • Please see my updated question. The problem is with 'dbService' and not $routeProvider – Shyamal Parikh Nov 25 '15 at 16:22
  • @ShyamalParikh As far as I can tell, the dbService needs to be injected as well - have you tried that? – Code Apprentice Nov 25 '15 at 18:05
  • @ShyamalParikh Also, if dbService is a service, not a provider, angular shouldn't allow it. Referring to the official angular docs: https://docs.angularjs.org/guide/module#module-loading-dependencies. $routeProvider works because it's a provider, not a service. – Code Apprentice Nov 25 '15 at 18:17
  • Please have a look at this question: http://stackoverflow.com/questions/33922131/angularjs-inject-service-in-app-config-such-that-to-safeguard-against-minificat/33922213?noredirect=1#comment55606812_33922213 – Shyamal Parikh Nov 26 '15 at 07:54
  • 1
    @ShyamalParikh Ah I learnt something new too - sorry I didn't provide the right answer. Thanks and good luck. – Code Apprentice Nov 26 '15 at 12:47
1

In order to safeguard against minification, one needs to array annotate the function with service dependencies.

Instead of passing just the function, pass an array with the names of the dependencies and the function.

app.config(['$routeProvider',function ($routeProvider) {
$routeProvider
    .when('/',
    {
        templateUrl: "partials/editor.html",
        controller: "AppCtrl",
        resolve: {
            //annotate this to prevent against minification
            data: ['dbService', getData]
        }
    })

    function getData (dbService) {
        return dbService.getData();
    }
}]);
Shyamal Parikh
  • 2,988
  • 4
  • 37
  • 78
0

refer angular injection. try,

app.config(["$routeProvider", function ($routeProvider) {
    $routeProvider
        .when('/',
        {
            templateUrl: "partials/editor.html",
            controller: "AppCtrl",
            resolve: {
                       //Following method doesn't work with minification
                        data: function (dbService) {
                                 return dbService.getData();
                              }
                     }
        })
}]);
Azad
  • 5,144
  • 4
  • 28
  • 56
  • Please have a look at the code carefully. I mentioned the problem was with 'dbService' service inclusion and not $routeProvider – Shyamal Parikh Nov 25 '15 at 16:24