Why is $http undefined in my factory?

Question

EDIT: This question is deprecated. Please see How to set a variable from an $http call then use it in the rest of the application WITHOUT making the whole application asynchronous instead.

I have a factory but $http is undefined. I thought DI would define it for me.

What am I doing wrong? What fundamental misunderstanding of Angular am I guilty of here?

The extra parens () is causing the function to be called during the configuration phase I guess. But URL is a property I want available right away for the whole application.

angular.module('myApp').factory('Test',['$http'],
  {
    URL: (function ($http) {
      $http.get('http:www.myserver.com/api/thing').then(function (response) { });
    })() // extra parens makes the function run right off the bat
  }
);

How can I fix it?

`// extra parens makes the function run right off the bat` and it makes it set the `URL` property to undefined... — Kevin B, Oct 01 '15 at 19:08
HINT: When you use that array syntax to specify the dependencies, the last item in the array needs to be a function: `angular.module('myApp').factory('Test', ['$http', function($http) { ... });` — Sunil D., Oct 01 '15 at 19:09

score 1 · Answer 1 · answered Oct 01 '15 at 19:09

1

This syntax doesn't look quite right. Try something like this

angular.module('myApp').factory('Test',['$http', function($http) {
}]);

answered Oct 01 '15 at 19:09

Richard Hamilton

25,478
10
60
87

score 1 · Accepted Answer · answered Oct 01 '15 at 19:14

Your factory definition is wrong. Using the inline dependency injection style that you have, the second argument should be an array whose last element is the function that consumes the previous dependencies

angular
    .module('myApp')
    .factory('Test', ['$http', function ($http) {
        //return an object that represents your service's API
        return { 
            URL: function () {
              $http.get('http:www.myserver.com/api/thing').then(function (response) { });
            } //pass the actual function to invoke later
        };
    }]);

Daniele Sassoli · Answer 3 · 2015-10-01T19:24:57.530

0

looks to me like your syntax is wrong, should be:

angular.module('myApp').factory('Test',['$http',function($http){
    return { 
        URL: function () {
          $http.get('http:www.myserver.com/api/thing').then(function (response) { });
        } //pass the actual function to invoke later
    };
}]);

edited Oct 01 '15 at 19:24

answered Oct 01 '15 at 19:09

Daniele Sassoli

899
12
34

Almost. Just remove the quotes from `$http` inside the function params – Richard Hamilton Oct 01 '15 at 19:10
It's still undefined. I listed this `Test` service as a dependency of a controller and tried to use `Test.URL` in the controller. The `$http` gets hit before the controller line that uses it, and it's still undefined. – toddmo Oct 01 '15 at 19:20
The syntax is still wrong here. `URL: ` doesn't appear to be inside an object literal, it's directly in the functinon body. – Kevin B Oct 01 '15 at 19:22
I upvoted it because I knew how much effort went into it anyway. – toddmo Oct 01 '15 at 19:42

Why is $http undefined in my factory?

3 Answers3