Error: [$injector:unpr] Unknown provider: $q. Confused about DI syntax

Question

Snippet 1 does not work. I get Error: [$injector:unpr] Unknown provider: $q

/* Snippet 1*/
var mApp = angular.module('MyApp',[]);
mApp.provider('authProvider', ['$q', function($q) {
    this.$get = function(){

        authProvider = {};
        authProvider.Title = function(){

            var deferred = $q.defer();
            deferred.resolve("promise resolved");
            return deferred.promise;

        }
        return authProvider;
    }
}]);

However, Snippet 2 works. I am confused why that is ? All the factory sample codes i have read, inject the dependency in the first line such as .factory('MyFactory',[$q,function($q) {}]); Why doesnt that style work in the provider code above ? Also, why are we injecting $q below in the GET declaration but not further down in the TITLE declaration.

/* Snippet 2*/
mApp.provider('authProvider', function() {
    this.$get = function($q){

        authProvider = {};
        authProvider.Title = function(){

            var deferred = $q.defer();
            deferred.resolve("promise resolved");
            return deferred.promise;

        }
        return authProvider;
    }
});

Please help!!!

(The code doesn't do anything right now. I am just trying to learn syntax)

That's because for a provider, the values are injected in the $get function. — Anik Islam Abhi, Sep 12 '15 at 14:31

maddygoround · Answer 1 · 2015-09-12T14:38:08.230

3

you can't do direct DI in provider , when you are using provider you have to inject your component in $get .

Reason you cannot inject dependency into the provider directly is that the provider runs during the module loading phase whereas the $get is run when instantiating the service you are providing.

You can not use any service during the loading/configuration phase of your modules.

edited Sep 12 '15 at 14:38

answered Sep 12 '15 at 14:33

maddygoround

2,145
2
20
32

score 2 · Answer 2 · edited Jun 20 '20 at 09:12

All the factory sample codes i have read, inject the dependency in the first line such as .factory('MyFactory',[$q,function($q) {}]); Why doesn't that style work in the provider code above ?

This graphic has always helped me understand the difference between a provider and a factory:

xxxxxx
_{source: simplygoodcode.com}

The factory function is the $get function of the provider. Before injection, the provider constuction function can configure the $get function. The $get function is where injection happens.

The provider construction function isn't injectable. That's why you get that error. The $get function is injectable and that is the function that you specify with factory. factory is just syntactic sugar for creating a provider with an empty constructor function.

Error: [$injector:unpr] Unknown provider: $q. Confused about DI syntax

2 Answers2

See Also