Angular 服务中的providedIn 属性不起作用答案

【问题标题】：providedIn Property In Angular Service Is not workingAngular 服务中的providedIn 属性不起作用
【发布时间】：2020-06-17 12:07:08
【问题描述】：

我正在学习 Angular DI，但提供的示例 (https://angular.io/guide/providers#providedin-and-ngmodules) 不起作用任何人都可以帮助我理解这里是我正在研究的 Stackblitz 的链接。 https://stackblitz.com/edit/angular-ivy-k1gvth 谢谢，凯沙夫

【问题讨论】：

Stackblitz 链接丢失，还请说明不工作的部分。
您能否详细说明“不工作”的含义？
请解释您在问题中遇到的问题。

标签： angular angular-services injectable

【解决方案1】：

您需要按照文档中的说明将 AppService 添加到 app.module.ts 中的 providers 数组中。

【讨论】：

但我想只使用providedIn策略来实现它。如果我在模块中注入服务，那么我什至不需要在服务中编写@Injectable()。
你需要以任何方式使用 Injectable 注解来兼容 Angular DI。如果您只想提供providedIn而不将其添加到提供程序，则需要将其用作providedIn：@Shabbir Dhangot提到的'root'
感谢您澄清我的疑问。

【解决方案2】：

您需要在app.component.ts 文件中添加提供程序。我在下面添加了 sn-p，它工作正常。

import { Component, VERSION } from '@angular/core';
import { AppServiceService } from './app-service.service';
@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ],
  providers: [AppServiceService]
})
export class AppComponent  {
  name = 'Angular ' + VERSION.major;
  constructor(ser: AppServiceService) {
      this.name = ser.sayHello();
  }
}

【讨论】：

是的，这也是文件建议的方式之一。但我只想使用@Injectable 的providedIn 属性来实现它。顺便说一句，感谢您的评论。 :)

【解决方案3】：

您可以将 provideIn 值用作 root。无需在应用程序模块中提供。

 providedIn: 'root'

如果你想在app.module.ts 中添加它，那么从服务中移除 Injectable 装饰器并添加到 app.module.ts 的提供者列表中。

您可以阅读官方文档了解更多详细信息。 https://angular.io/guide/singleton-services

您也不能在提供的模块中给出模块名称。 “root”、“any”和“platform”有预定义的选项。你可以在https://angular.io/api/core/Injectable阅读更多内容

【讨论】：

但我想只使用providedIn策略来实现它。如果我在模块中注入服务，那么我什至不需要在服务中编写@Injectable()。
@KeshavSharma 阅读我的更新答案，这将澄清您的疑问。