web-dev-qa-db-ja.com

Angular 7で循環依存が検出されました

私のAngular 7アプリに次のアプリ構造があります：

AppModule
DashboardModule
  DashboardChild1
  DashboardChild2
  DashboardChild3
  DashboardService
AdminModule
  AdminChild1
  AdminChild2
  AdminChild3

ダッシュボードサービスをDashboardModuleでのみ使用できるようにしたいので、このリンク providedin-and-ngmodules をたどりました。

これが私のDashboardServiceです。

import { Injectable } from '@angular/core';
import { DashboardModule } from './dashboard.module';

@Injectable({
  providedIn: DashboardModule
})
export class DashboardService {
  .......
}

DashboardChild1コンポーネントでそのサービスを使用しましたが、次のエラーが発生します。

検出された循環依存関係の警告：src/app/dashboard/dashboard-child1/dashboard-child1.component.ts-> src/app/dashboard/dashboard.service.ts-> src/app/dashboard/dashboard.module.ts- > src/app/dashboard/dashboard-routing.module.ts-> src/app/dashboard/dashboard-child1/dashboard-child1.component.ts

検出された循環依存関係の警告：src/app/dashboard/dashboard-routing.module.ts-> src/app/dashboard/dashboard-child1/dashboard-child1.component.ts-> src/app/dashboard/dashboard.service ts-> src/app/dashboard/dashboard.module.ts-> src/app/dashboard/dashboard-routing.module.ts

検出された循環依存関係の警告：src/app/dashboard/dashboard.module.ts-> src/app/dashboard/dashboard-routing.module.ts-> src/app/dashboard/dashboard-child1/dashboard-child1.component ts-> src/app/dashboard/dashboard.service.ts-> src/app/dashboard/dashboard.module.ts

検出された循環依存関係の警告：src/app/dashboard/dashboard.service.ts-> src/app/dashboard/dashboard.module.ts-> src/app/dashboard/dashboard-routing.module.ts-> src/app /dashboard/dashboard-child1/dashboard-child1.component.ts-> src/app/dashboard/dashboard.service.ts

ここで何が欠けていますか？

angularangular-servicesangular-ngmodelangular-module
3
Pritam Bohra

これが発生する可能性が最も高いのは、

DashboardChild1は、DashboardModuleのメンバーであり、DashboardChild1は注入によってDashboardModuleにアクセスしようとしています。結果は循環依存です。

DashboardModule calls DashboardChild1 
DashboardChild1 calls DashboardModule
DashboardModule class DashboardChild1
DashboardChild1 calls DashboardModule
...
...
...
...

同じことがDashboardServiceにも有効です。

DashboardModule calls DashboardChild1 calls DashboardService
DashboardService calls DashboardModule
DashboardModule calls DashboardChild1 calls DashboardService
DashboardService calls DashboardModule
...
...
...
...
5
Derviş Kayımbaşıoğlu

このブログ投稿にあるとおり： https://medium.com/@tomastrajan/total-guide-to-angular-6-dependency-injection-providedin-vs-providers-85b7a347b59f

DashboardServiceを独自のモジュールDashboardServiceModuleに引き出すことができます。次に、それをDashboardModuleにインポートし、DashboardChild(ren)で使用します。

1
kjbetz