How to inject 2 different instances of a module in AngularJs

Question

Say I have a crudService.js file:

crudService.module('genericCrudService', ['$http', '$log', 'config',  function ($http, $log, config) {
        ....
        return {
            setSomeAttribute: function(m) {
                // set attribute
            }
        }
    }]);

And then I have a module that need to differently configured instances of this crud service:

module.factory('Task', ['genericCrudService','genericCrudService', function (service, actionService) {
        ...
        return {
           init: function(p) {
               service.setSomeAttribute('a');
               actionService.setSomeAttribute('b');
           }
        }
    }]);

But then I noticed when trying to use the service variable, that its attribute is set to 'a'. What am I doing wrong?

Not really clear what you are trying to do or what expectations are — charlietfl, Jul 25 '16 at 17:43
As others have mentioned, these services are singletons by design, and by embracing this model, it enables a powerful method of communication within a module. For example, you can inject your service in one controller, subscribe to an event, store data, or change a variable on the service and in another controller you can access that data or trigger the event. In Angular 2, this is your means of communicating between your components because the scope is gone. I believe whatever it is you need to do can still be done with a singleton, you need only rethink your approach. — Zach, Jul 25 '16 at 19:02

Estus Flask · Accepted Answer · 2016-07-25T19:01:42.547

Angular services are singletons which are cached on the first injection:

All services in Angular are singletons. That means that the injector uses each recipe at most once to create the object. The injector then caches the reference for all future needs.

genericCrudService refers to the same service, injecting it as service and actionService variables results in having the instance of genericCrudService service in both variables, service === actionService.

If a service should get a new instance only in some cases, service instance may get a method (e.g. factory or getInstance) that returns a new instance of the object:

  app.factory('service', () => {
    function Service() {
      this.method = ...;
      this.factory = () => new Service;
    }

    return new Service;
  });

  ...
  var serviceInstance = service.factory();

If a service should get a new instance everywhere, it should return a factory or constructor function that will be instantiated manually:

  app.factory('Service', () => function () {
    this.method = ...;       
  });

  ...
  var serviceInstance = new Service;

score 0 · Answer 2 · edited May 23 '17 at 11:51

0

You cannot do that because an angular service is a singleton... Have a look on that post it explains it very well ;) Are Angularjs services singleton?

You can also have a look on that AngularJS: Service vs provider vs factory. Maybe you'll find a way to do what you want ;)

edited May 23 '17 at 11:51

Community

1
1

answered Jul 25 '16 at 17:03

R. Foubert

633
4
8

How to inject 2 different instances of a module in AngularJs

2 Answers2