How to use injected dependency in a angular service?

Question

I am creating a custom service which logs a user in to my system. In this service, I need to use core services such as $http - How do I actually depend these to be used in my service?

My current code:

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

        var login = function(){
            console.log($http);
        }

        return {login : login};

}])

I call the login function from a controller like so

loginService.login();

I hoped that my console will output the $http object I injected, but it's returning undefined.

How do I access this in the correct way?

to me it looks like you want to do write a service instead of a factory. — LionC
– LionC, Commented Jul 7, 2015 at 11:03

LionC · Accepted Answer · 2015-07-07 10:55:07Z

3

You need to add the dependencies to your function arguments:

.factory('loginService', ['$http', '$rootScope', function($http, $rootScope) {
    //You can use $http and $rootScope here now
}

See the official docs for more info on Dependency Injection in angular

answered Jul 7, 2015 at 10:55

LionC

3,1061 gold badge24 silver badges31 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Jerska · Accepted Answer · 2015-07-07 11:17:25Z

0

Services you inject need to be passed as arguments of the function:

['$http', '$rootScope', function($http, $rootScope)

By the way, you'll need to do the same where you're trying to use it:

app.controller(['loginService', function (loginService) {
  loginService.login();
});

edited Jul 7, 2015 at 11:17

answered Jul 7, 2015 at 10:54

Jerska

12.1k4 gold badges38 silver badges54 bronze badges

Comments

Archis · Accepted Answer · 2015-07-07 11:56:29Z

0

try this:

var myapp = angular.module('mainApp', []);

myapp.controller('myController', ['$scope', 'myFactory', function($scope, myFactory) {
    myFactory.login();
}]);

myapp.factory('myFactory', ['$http', function($http) {
    var services = {};

    services.login = function() {
      console.log($http);
    }

    return services;
}]);

View:

<div ng-app='mainApp' ng-controller='myController'></div>

answered Jul 7, 2015 at 11:56

Archis

215 bronze badges

Collectives™ on Stack Overflow

How to use injected dependency in a angular service?

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related