J'ai la structure d'application suivante dans mon Angular 7 app:
AppModule
DashboardModule
DashboardChild1
DashboardChild2
DashboardChild3
DashboardService
AdminModule
AdminChild1
AdminChild2
AdminChild3
et je veux que DashboardService soit disponible uniquement dans le DashboardModule
, j'ai donc suivi ce lien providedin-and-ngmodules .
Voici mon DashboardService
:
import { Injectable } from '@angular/core';
import { DashboardModule } from './dashboard.module';
@Injectable({
providedIn: DashboardModule
})
export class DashboardService {
.......
}
J'ai utilisé ce service dans le composant DashboardChild1, mais il donne l'erreur suivante:
AVERTISSEMENT dans Dépendance circulaire détectée: 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
AVERTISSEMENT dans Dépendance circulaire détectée: 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
AVERTISSEMENT dans Dépendance circulaire détectée: 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
AVERTISSEMENT dans Dépendance circulaire détectée: 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
qu'est-ce que j'oublie ici?
Cela est plus susceptible de se produire car
DashboardChild1 est membre de DashboardModule et DashboardChild1 essayant d'accéder à DashboardModule par injection. Le résultat est la dépendance circulaire.
DashboardModule calls DashboardChild1
DashboardChild1 calls DashboardModule
DashboardModule class DashboardChild1
DashboardChild1 calls DashboardModule
...
...
...
...
il en va de même pour DashboardService
DashboardModule calls DashboardChild1 calls DashboardService
DashboardService calls DashboardModule
DashboardModule calls DashboardChild1 calls DashboardService
DashboardService calls DashboardModule
...
...
...
...
Comme vu dans cet article de blog: https://medium.com/@tomastrajan/total-guide-to-angular-6-dependency-injection-providedin-vs-providers-85b7a347b59f
Vous pouvez extraire le DashboardService
dans son propre module DashboardServiceModule
. Importez ensuite cela dans DashboardModule
et utilisez-le dans votre DashboardChild(ren)
.