AngularJS Error: Unknown provider: aProvider <-

2019-02-06 01:50发布

问题:

OK I'm officially bald now, after having been streching my hair out with this infamous problem: The minfied AngularJS app just doesn't work, with this error thown out:

Error: [$injector:unpr] Unknown provider: aProvider <- a http://errors.angularjs.org/1.2.6/$injector/unpr?p0=aProvider%20%3C-%20a at http://localhost/my-app/dist/scripts/1bde0e2e.vendor.js:4:11492 at http://localhost/my-app/dist/scripts/1bde0e2e.vendor.js:4:26946 at Object.c [as get] (http://localhost/my-app/dist/scripts/1bde0e2e.vendor.js:4:26250) at http://localhost/my-app/dist/scripts/1bde0e2e.vendor.js:4:27041 at c (http://localhost/my-app/dist/scripts/1bde0e2e.vendor.js:4:26250) at Object.d [as invoke] (http://localhost/my-app/dist/scripts/1bde0e2e.vendor.js:4:26496) at http://localhost/my-app/dist/scripts/1bde0e2e.vendor.js:9:910 at Object.f [as forEach] (http://localhost/my-app/dist/scripts/1bde0e2e.vendor.js:4:11927) at http://localhost/my-app/dist/scripts/1bde0e2e.vendor.js:9:856 at j (http://localhost/my-app/dist/scripts/1bde0e2e.vendor.js:5:27235)

Lots of other people had this problem as well, but looks like it could be fixed by declaring dependencies as an array instead of bare function parameters, like this:

angular.module('my-app').controller('LoginCtrl', [ '$scope', 'HttpService', function($scope, HttpService) { ... }]);

instead of this:

angular.module('my-app').controller('LoginCtrl', function($scope, HttpService) { ... });

But it doesn't work in my case. I checked all of my scripts (coffee and generated javascripts as well), they all use the proper array-style declaration.

The problem doesn't come from extra packages apparently. I tried moving all extra package references out of <!-- bower:js --> block (so that they are not minified by grunt), yet the problem still remains. Which means, it's my code to blame... But then again, I've tried the (seems to be) only fix available, to no avail.

Any hint, even on how to properly debug this?

Thanks in advance!

回答1:

Finally I've found the problem. And yes, it's a DI bug which I missed.

To all who may be suffering from the same headache: array-format declaration must be done in $routeProvider's resolve options as well. In my case (CoffeeScript ahead):

app.config (['$routeProvider', ($routeProvider) ->
  $routeProvider
    .when '/',
      templateUrl: 'views/main.html'
      controller: 'MainCtrl'
      resolve: 
        groups: ['GroupService', (GroupService) ->  # I MISSED THIS
          return GroupService.getAll()
        ]
        entries: ['EntryService', (EntryService) ->  # AND THIS
          return EntryService.getAll()
        ]
    # ...
])

Hope this helps!



回答2:

This behaviour could come if you use implicit injection, instead of explicit declaring your dependencies. In my experience I faced this kind of problem with particular kind of Angular.js services that return instantiable class (for example to create abstract controller Classes or some other particular cases).

For example: AbstractBaseControllerClass

During minification I had the same problem. I solved using internal declaration of dependency injection. Hope this helps



回答3:

For the ones that doesn't like CoffeeScript.

I just took some of my code and put it in.

 $stateProvider

    .state('screen', {
        url: '/user/',
        templateUrl: 'user.html',
        controller: 'UserController',
        controllerAs: 'user',
        location: "User",
        resolve: ['$q', 'UserService', '$state', '$timeout', authenticateUser
        ]
    })

function authenticateUser($q, UserService, $state, $timeout) {

    UserService.getLoginStatus().then(function () {
        if (UserService.user) {
            console.log("is user");
            return $q.when();
        } else {
            console.log("not user");

            $timeout(function () {
                // This code runs after the authentication promise has been rejected.
                // Go to the log-in page
                $state.go('login')
            });
            return $q.reject()

        }
    });

}