providedIn 属性在 Angular 服务不工作

Question

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

Answer 1

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

Answer 2

您可以将 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阅读更多信息

Answer 3

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

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();
  }
}