Angular NullInjectorError 沒有服務提供商？

Question

在我的代碼中，我有一些按鈕，當您單擊它們時，應該會打開一個彈出窗口，並且您應該以列表的形式查看詳細信息。 每當我單擊這些按鈕時，都會出現以下錯誤。 我不知道為什么我無法到達我想要的屬性。 我的代碼可能有什么問題，我該如何解決？

TS 代碼：

@Component({
  selector: 'warehouse-detail-dialog',
  templateUrl: './warehouse-detail-dialog.component.html',
  styleUrls: ['./warehouse-detail-dialog.component.scss']
})
export class WarehouseDetailDialogComponent implements OnInit {

  cell: ICell;
  userRights: IActionRoleMap;


  displayedColumns: string[] = [
    'EntryPackageBarcode',
    'StockIntegrationCode',
    'ProductName',
    'Balance',
];
dataSource: MatTableDataSource<IStockPackageTransaction>;

@ViewChild(MatPaginator, { static: true }) paginator: MatPaginator;
@ViewChild(MatSort, { static: true }) sort: MatSort;


  /**
   *
   */
  constructor(
      private _terminalService: TerminalService,
      private _router: Router
  ) {

    _terminalService.onCellDetailChanged.subscribe((response: ICell) => {
      this.cell = response;
      

      this.dataSource = new MatTableDataSource(response.StockPackageTransactions);
      this.dataSource.paginator = this.paginator;
      this.dataSource.sort = this.sort;

  });

     
  }

服務 TS：

cellDetail: ICell;
    onCellDetailChanged: BehaviorSubject<any> = new BehaviorSubject([]);
 getCellDetailById(id: string) {
        return new Promise((resolve, reject) => {
            this._http
                .get("Production/GetCellDetailById/" + id)
                .subscribe((response: ICell) => {
                    this.cellDetail = response;
                    this.onCellDetailChanged.next(this.cellDetail);
                    resolve(this.cellDetail);
                }, reject);
        });
    }

錯誤：

WarehouseDetailDialogComponent_Host.ngfactory.js? [sm]:1 ERROR NullInjectorError: StaticInjectorError(AppModule)[WarehouseDetailDialogComponent -> TerminalService]: 
  StaticInjectorError(Platform: core)[WarehouseDetailDialogComponent -> TerminalService]: 
    NullInjectorError: No provider for TerminalService!
    at NullInjector.get (core.js:778)
    at resolveToken (core.js:2564)
    at tryResolveToken (core.js:2490)
    at StaticInjector.get (core.js:2353)
    at resolveToken (core.js:2564)
    at tryResolveToken (core.js:2490)
    at StaticInjector.get (core.js:2353)
    at resolveNgModuleDep (core.js:26403)
    at NgModuleRef_.get (core.js:27491)
    at resolveNgModuleDep (core.js:26403)

Answer 1

將TerminalService添加到providers: []數組中相應的根模塊（可能是app.module.ts ）。 錯誤提示No provider for TerminalService!

Answer 2

在根模塊的 providers 數組中提供它是一種解決方案，但您應該使用providedIn模式有一個簡單而重要的原因：搖樹。 如果您為您的服務提供

@Injectable({
  providedIn: 'root'
})

當您不使用它們時，它們將被搖動，並且您的捆綁包大小會更小

來源： https://angular.io/guide/providers#providedin-and-ngmodules