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