0

I'm trying to create a provider to handle authentication in my app 

     function Authenticator($http) {
        console.log($http);
        return {
            test: function() {}
        }
    }

    app.provider('authenticator', function AuthenticatorProvider() {

        this.config = function () {
            var requestParams;
            return {
                setRequestParams: function (params) {
                    requestParams = params;
                }
            }
        }();


        this.$get = function($http) {
            return new Authenticator($http);
        };

    });

When i run the code above $http is set as undefined. What am i doing wrong? What's the right way to inject $http service into a custom provider?

Thanks

Eduardo Leal
  • 807
  • 2
  • 9
  • 18

1 Answers1

4

I am guessing what you really want to be doing is something like this:

app.factory('AuthenticationService', ['$http', function($http) {
    var AuthenticationService = function() {};

    AuthenticationService.prototype.config = function)() { ... }

    return new AuthenticationService();
}]);

This creates a service that can be injected into other controllers, directives and services, which there will only ever be a single shared instance of. Fetching the service by its string means the reference inside the function is local to the closure, which means the variable can be safely renamed, saving precious bandwidth.

liamness
  • 742
  • 3
  • 5
  • I'd tryed to do this... but i was passing $http as param to AuthenticationService. So I removed the $http, just like you said, and it worked! Thanks!! – Eduardo Leal Mar 15 '15 at 13:31
  • Works but i have to call authenticatorProvider.$get() to get it working, i don't know if this is a good practice... is it? – Eduardo Leal Mar 15 '15 at 13:54
  • You have to inject it, like you injected $http, somewhere for the service to be instantiated. I don't see any usage of authenticatorProvider or $get() on that fiddle, so I'm not totally sure where the problem is. – liamness Mar 15 '15 at 13:58
  • look http://jsfiddle.net/lealeduardo/opjgcL94/3/ I've put my app.config function right below the provider. The first console.log returns `Object {$get: function}` . The second console log (calling .$get()) returns `Object {getUserInfo: function, login: function, logout: function, setRequestParams: function, getRequestParams: function}` – Eduardo Leal Mar 15 '15 at 14:15
  • Ah. You can access providers in app.config(), and instances in app.run(). I didn't know angular would automatically create a provider for you when you make a service, that's pretty cool. Anyway I guess you do var authenticator = authenticatorProvider.$get() somewhere in app.config, then you've got an object you can use. But if possible I would defer doing anything with services you've created yourself until the app is running. – liamness Mar 15 '15 at 14:26
  • It didn't work. The settings value set in the config function got lost – Eduardo Leal Mar 15 '15 at 14:58