別のモジュールで使用できないモジュールからの角度付きエクスポートされたコンポーネント

Question

私のAppModuleでカスタムコンポーネントをエクスポートしていますが、AppModuleにインポートされている別のモジュールでカスタムコンポーネントを使用できません。私はエクスポートされたコンポーネントが世界的に見えると思いましたか？

TestModule内のコンポーネントのセレクタ 'app-calendar'でCalendarComponentを使用しようとしています。

@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> 

コンソールは 'APP-カレンダー' というエラーをスロー

app.module.ts既知の要素ではありません（モジュールの一部ではありません）

私は何が欠けていますか？どこでもCalendarComponentを削除し、CalendarModuleをインポート

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

AppModuleで

calendar.module.ts：

Answer 1

CalendarModuleを作成したり、共有モジュールにCalendarコンポーネントを追加するように（あなたのアーキテクチャに依存します）宣言の一部が使用されている場合は、（または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