angular - Hur får man åtkomst till en komponent från ett modul som importeras i app-modulen?


Vi har ett projekt med denna hierarki.

app/
├── app.component.html
├── app.component.ts
├── app.module.ts    <--moduleA and moduleB is imported here  
├── app-routing.module.ts
├── moduleA/
│   ├── moduleA-routing.module.ts
│   ├── moduleA.module.spec.ts
│   ├── moduleA.module.ts
│   ├── moduleA.component.ts
│   └── moduleA.component.html
├── moduleB/
│   ├── moduleB-routing.module.ts
│   ├── moduleB.module.ts     <-- moduleC is imported here
│   ├── moduleB.component.module.ts
│   ├── moduleB.component.html
│   ├── moduleB.component.ts
|   ├── moduleC/
│   │    ├── moduleC-routing.module.ts
│   │    ├── moduleC.module.ts
│   │    ├── moduleC.component.module.ts
│   │    ├── moduleC.component.html   --> Need to use moduleA component here
│   │    └── moduleC.component.ts

moduleC är en undermodul till moduleB. Vi har importerat moduleA i AppModule. Kan vi komma åt komponenten i moduleA i moduleC utan att återigen importera moduleA inuti moduleC? Med andra ord, är det nödvändigt att importera en modul som redan har importerats i AppModule igen i en undermodul för att använda dess komponent?.

När jag försöker utan att importera moduleA igen i moduleC, kraschar det

"Malltolkningsfel: {{selector name}} är inte ett känt element"

Men om det är importerat så fungerar det bra.

Svar #1

Importera inte moduleA och moduleB i filen app.module.ts.
Importera moduleA i moduleB.module.ts
Och importera moduleB i moduleC.module.ts
Och slutligen importera moduleC i app.module.ts
Nu kan du komma åt moduleA-komponenten i både moduleB och moduleC.

Svar #2

Du bör använda imports:[ModuleA] och även exports:[ModuleA], för att ha tillgång till det från yttre modul