Angular Provider 或 Providedin答案

【问题标题】：Angular Providers or ProvidedinAngular Provider 或 Providedin
【发布时间】：2023-02-21 19:04:42
【问题描述】：

我似乎无法找到关于如何使用提供者并在 Angular 中提供的正确方法。我确实阅读了有关该主题的文档，但是有一件基本的事情我无法弄清楚。

假设我有一个服务 my.service.ts 如下我使用 ProvidedIn:'root'

import { Injectable } from '@angular/core';
@Injectable({
  providedIn: 'root'
})
export class MyService  {

  constructor() {
  }
  public Addup(a:number, b:number) : number
  {
    return a+b;
  }
}

我希望该服务作为单例在整个 SPA 中可用。我可以在每个需要的模块中注入该服务，一切正常。如在

    import {MyService} from '@services/my.service'
    @Component({
    ....
    })
    constructor (...
    private myService: MyService  ,
    ...){}

ngOnInit(): void {
const c = myService.Addup(2,4);
}

一切按预期工作。但是，我还应该将它添加到 app.module.ts 的提供程序部分吗？当我这样做时，看起来行为完全没有区别？

应用程序模块.ts：

import {MyService} from '@services/my.service'
...
...
@NgModule({
Declarations [...],
Imports: [...],
providers: [MyService,....]
}
export class AppModule {}

有人可以阐明这一点吗？服务中的 ProvidedIn:'root' 是否与将其添加到 appModule 中的提供者数组相同？

谢谢。

【问题讨论】：

标签： angular dependency-injection angular-providers

【解决方案1】：

root 选项在 Module Injector 树的 Root Module Injector 中注册服务。这将使它对整个应用程序可用。这与服务是延迟加载还是急切加载无关。

它会产生与在应用程序模块中提供服务相同的结果。 ProvidedIn 是 tree-shakeable 的，但如果您只是尝试导入与声明使用客户端的组件相同的模块，请注意循环引用。

【讨论】：