diff --git a/.pullapprove.yml b/.pullapprove.yml index 43774920b4..62b0b2d7f2 100644 --- a/.pullapprove.yml +++ b/.pullapprove.yml @@ -366,6 +366,7 @@ groups: 'aio/content/images/guide/pipes/**', 'aio/content/guide/providers.md', 'aio/content/examples/providers/**', + 'aio/content/images/guide/providers/**', 'aio/content/guide/singleton-services.md', 'aio/content/guide/set-document-title.md', 'aio/content/examples/set-document-title/**', diff --git a/aio/content/examples/providers/src/app/user.service.2.ts b/aio/content/examples/providers/src/app/user.service.2.ts new file mode 100644 index 0000000000..de97ce6a45 --- /dev/null +++ b/aio/content/examples/providers/src/app/user.service.2.ts @@ -0,0 +1,7 @@ +import { Injectable } from '@angular/core'; + +@Injectable({ + providedIn: 'any', +}) +export class UserService { +} diff --git a/aio/content/guide/providers.md b/aio/content/guide/providers.md index 46087eedc9..e9154c8506 100644 --- a/aio/content/guide/providers.md +++ b/aio/content/guide/providers.md @@ -52,6 +52,14 @@ Any component created within a lazy loaded module’s context, such as by router Though you can provide services by lazy loading modules, not all services can be lazy loaded. For instance, some modules only work in the root module, such as the Router. The Router works with the global location object in the browser. +As of Angular version 9, you can provide a new instance of a service with each lazy loaded module. The following code adds this functionality to `UserService`. + + + +With `providedIn: 'any'`, all eagerly loaded modules share a singleton instance; however, lazy loaded modules each get their own unique instance, as shown in the following diagram. + +any-provider-scope + ## Limiting provider scope with components diff --git a/aio/content/images/guide/providers/any-provider.svg b/aio/content/images/guide/providers/any-provider.svg new file mode 100644 index 0000000000..cdc3ee18dc --- /dev/null +++ b/aio/content/images/guide/providers/any-provider.svg @@ -0,0 +1,3 @@ + + +
Eagerly Loaded Modules
Eagerly Loaded Modules
UserService
UserService
EmployeeModule
EmployeeModule
UserService
UserService
AppModule
AppModule
ProductModule
ProductModule
DepartmentModule
DepartmentModule
UserService
UserService
Lazy Loaded Modules
Lazy Loaded Modules
Viewer does not support full SVG 1.1
\ No newline at end of file