How to make angular's services available to independent objects ; Angular JS

Question

In my angular app, I am trying to make a dataAdapter factory where I can quickly switch between the local adapter and the api adapter during development and publishing.

My dataAdapter factory looks like this

myApp.factory('dataAdapter', function($http, $q){
   var dataAdapter = new apiAdapter;
   //var dataAdapter = new localAdapter;
    return dataAdapter;
});

and my adapter objects (here api adapter) would looks something like this. (This will be located in another file called apiAdapter.js )

var apiAdapter = function(){
  return {
    getData : function(){ $http.get(). ....; }
  }
}

Now this isn't working for me, because $http is not available inside apiAdapter object. Now if I move var apiAdapter = function(){....} just before var dataAdapter = new apiAdapter; , it works fine. Is there a way to make the angular services available to apiAdapter without moving it inside the factory?

I hope, I have been able to describe my problem clearly.

pass $http as paramter to constructor

Grundy
– Grundy

2014-07-08 08:49:20 +00:00
Commented Jul 8, 2014 at 8:49 — Grundy
– Grundy, Commented Jul 8, 2014 at 8:49

maurycy · Accepted Answer · 2014-07-08 10:07:32Z

3

I don't really see a point in sharding that small functionality so in my opinion it should look like

myApp.factory('dataAdapter', function($http, $q){
    return {
      getData : function(){ $http.get(). ....; }
    }
});

but if you have to do it for some reason

myApp.factory('dataAdapter', function($http, $q){
   var dataAdapter = new apiAdapter($http);
   //var dataAdapter = new localAdapter;
    return dataAdapter;
});

var apiAdapter = function(http){//
  return {
    getData : function(){ http.get(). ....; }
  }
}

edited Jul 8, 2014 at 10:07

answered Jul 8, 2014 at 9:02

maurycy

8,4201 gold badge30 silver badges44 bronze badges

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

Comments

Mosho · Accepted Answer · 2014-07-08 09:15:51Z

1

Regardless of your reasons for doing this, this is how it's typically done, in the barest manner:

var $injector = angular.injector(['ng']);

var apiAdapter = $injectorfunction(){
  return {
    getData : function(){ 
        $injector.invoke(function($http){
            $http.get();
        }); 
    }
  }
}

docs reference 1

docs reference 2

edited Jul 8, 2014 at 9:15

answered Jul 8, 2014 at 9:09

Mosho

7,0783 gold badges36 silver badges52 bronze badges

Collectives™ on Stack Overflow

How to make angular's services available to independent objects ; Angular JS

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related