Why is constructor call each time after injection of service?

Question

I use Angular 2. I use singleton service @NgModule({}) in section providers: ['MenuService'] I use MenuService.

MenuService looks as: @Injectable()

export class MenuService {

  constructor(private userService: UserService, private i18nService: I18nService) { console.log('Called'); }
}

There are two components where I inject this service:

export class HeaderComponent {
  constructor(private menuService: MenuService) {}
}

export class HomeComponent {
  constructor(private menuService: MenuService) {}
}

I see console.log('Called'); twice, why is it called repeatly?

Are the two components and the service is in the same module? — Anuradha Gunasekara, Jul 18 '18 at 07:19
Yes, two components are determined in the same module: `Core.module` in section declarations: `declarations: [ HomeComponent, HeaderComponent ]` — POV, Jul 18 '18 at 07:22

score 1 · Answer 1 · answered Jul 18 '18 at 07:23

1

There are two ways to make a service a singleton in Angular:

Declare that the service should be provided in the application root.

Include the service in the AppModule or in a module that is only imported by the AppModule.

Beginning with Angular 6.0, the preferred way to create a singleton services is to specify on the service that it should be provided in the application root. This is done by setting providedIn to root on the service's @Injectable decorator
import { Injectable } from '@angular/core';

@Injectable({
  providedIn: 'root',
})
export class UserService {
}

taken from Angular official documentation.

answered Jul 18 '18 at 07:23

Anuradha Gunasekara

6,553
2
27
37

What about Angular 2? – POV Jul 18 '18 at 07:25
Did you go through [this](https://stackoverflow.com/questions/36198785/how-do-i-create-a-singleton-service-in-angular-2/36200020) – Anuradha Gunasekara Jul 18 '18 at 07:26
Invalid number of arguments in Angular 2 if to do: `@Injectable({ providedIn: 'root', })` – POV Jul 18 '18 at 07:27
1

Yeah you cant use `@Injectable({ providedIn: 'root'})` in angular 2. Only after angular 6.0 you can use this. – Anuradha Gunasekara Jul 18 '18 at 07:28

score 1 · Answer 2 · answered Jul 23 '18 at 14:11

Yes, injected service constructors are called by component immediately when they are initialized.

export class HomeComponent {
  constructor(private menuService: MenuService) {}
}

is equivalent of doing

private menuService: MenuService;
export class HomeComponent {
  constructor() {
      this.menuService = new MenuService(params...);
  }
}

So basically, DI eliminates the need of creating the objects explicitly as shown in second method.

DI is helpful when MenuService constructor is expecting some parameters and you are not sure what to send.

1

But OP says it's a singleton? – span May 26 '19 at 16:31

score -2 · Accepted Answer · answered Jul 18 '18 at 07:22

-2

A service will always run its constructor when injected in a component, it has to set the fields/props of the service. So it is not weird behaviour at all. The injected interfaces 'act' as 2 objects.

answered Jul 18 '18 at 07:22

JohnMcClane

128
6

Are you sure about this? – POV Jul 18 '18 at 07:24
Well it is fairly obvious, one has to have an instance of a service first before you can use it, therefore it has to be instantiated (aka constructor will be called) – JohnMcClane Jul 18 '18 at 07:28
3

Why would it be called twice if it is a singleton? – span May 26 '19 at 16:31

Why is constructor call each time after injection of service?

3 Answers3

Linked