模塊中的角度導出組件不能在另一個模塊中使用

我在AppModule中導出自定義組件，但無法在AppModule中導入的其他模塊中使用該組件。我認爲導出的組件在全球可見？模塊中的角度導出組件不能在另一個模塊中使用

我想在TestModule的一個組件中使用帶有選擇器'app-calendar'的CalendarComponent。

app.module.ts

@NgModule({ 
    declarations: [ ... , 
    CalendarComponent, 
    ], 
    imports: [ ... , 
    TestModule, 
    ], 
    exports: [ ... 
    CalendarComponent, 
    ], 
    providers: [ ... ], 
    bootstrap: [AppComponent] 
})

test.module.ts

@NgModule({ 
    declarations: [ ... , 
    TestComponent 
    ], 
    imports: [ ... ], 
    exports: [ ... ], 
    providers: [ ... ] 
})

test.component.html

<app-calendar></app-calendar>

控制檯拋出錯誤 '應用程序，日曆'不是已知元素（不是模塊的一部分）

我錯過了什麼？

來源

2017-09-23 user3740359

TESTM odule應該導入導出日曆組件的組件 – yurzui

你可以閱讀[避免與Angular中的模塊常見混淆]（https://blog.angularindepth.com/avoiding-common-confusions-with-modules-in-angular-ada070e6891f） –

@yurzui AppModule已經導入了TestModule，所以TestModule無法導入AppModule，因爲那將是一個循環依賴或者我錯了？ – user3740359

創建CalendarModule或添加Calendar組件添加到您共享模塊（取決於你的架構），如：

calendar.module.ts

@NgModule({ 
    declarations: [CalendarComponent], 
    exports: [CalendarComponent] 
}) 
export class CalendarModule {}

在AppModule刪除CalendarComponent無處不在並導入CalendarModule （或SharedModule）如果某些聲明使用CalendarComponent

個

app.module.ts

@NgModule({ 
    declarations: [ ... , 
    CalendarComponent, <== remove it 
    ], 
    imports: [ 
    TestModule, 
    // import CalendarModule here if any of declarations above 
     use CalendarComponent in their template 
    ], 
    exports: [ ... 
    CalendarComponent, // remove it 
    ], 
    bootstrap: [AppComponent] 
}) 
export class AppModule {}

test.module.ts

@NgModule({ 
    declarations: [ ... , 
    TestComponent 
    ], 
    imports: [ 
    CalendarModule <=== add this, so TestComponent will be able 
         to use CalenderComponent in its template 
    ] 
}) 
export class TestModule {}

欲瞭解更多詳情，請參閱

Angular 2 Use component from another module

來源

2017-09-23 16:30:38 yurzui

模塊中的角度導出組件不能在另一個模塊中使用

回答

相關問題