ProvideIn - when should I use this new Angular 6 feature?

Question

In new version Angular 6 - ProvideIn has been added. I'm wondering when should I use it. Should I use it Only for services from Core Module?

When I'm trying to use it in my service which was imported in my SomeCustomModule:

@Injectable({
  providedIn: SomeCustomModule,
})

I had warning: WARNING in Circular dependency detected

may be this can help you. https://stackoverflow.com/questions/51062235/angular-6-providedin-a-non-root-module-is-causing-a-circular-dependency — Tarang, Aug 08 '18 at 13:27
Possible duplicate of [Angular 6 - ProvidedIn a non root module is causing a circular dependency](https://stackoverflow.com/questions/51062235/angular-6-providedin-a-non-root-module-is-causing-a-circular-dependency) — Dzhuneyt, Mar 12 '19 at 08:01

score 0 · Answer 1 · answered Jan 15 '20 at 18:32

Using providedIn
Beginning with Angular 6.0, the preferred way to create a singleton service is to set providedIn to root on the service's @Injectable() decorator. This tells Angular to provide the service in the application root.

src/app/user.service.ts
content_copy
import { Injectable } from '@angular/core';

@Injectable({
  providedIn: 'root',
})
export class UserService {
}
For more detailed information on services, see the Services chapter of the Tour of Heroes tutorial.

NgModule providers array
In apps built with Angular versions prior to 6.0, services are registered NgModule providers arrays as follows:


@NgModule({
  ...
  providers: [UserService],
  ...
})
If this NgModule were the root AppModule, the UserService would be a singleton and available throughout the app. Though you may see it coded this way, using the providedIn property of the @Injectable() decorator on the service itself is preferable as of Angular 6.0 as it makes your services tree-shakable.

Generally, you'll only need providedIn for providing services and forRoot()/forChild() for routing. However, understanding how forRoot() works to make sure a service is a singleton will inform your development at a deeper level.

If a module defines both providers and declarations (components, directives, pipes), then loading the module in multiple feature modules would duplicate the registration of the service. This could result in multiple service instances and the service would no longer behave as a singleton.

There are multiple ways to prevent this:

Use the providedIn syntax instead of registering the service in the module.
Separate your services into their own module.
Define forRoot() and forChild() methods in the module.

ProvideIn - when should I use this new Angular 6 feature?

1 Answers1