web-dev-qa-db-ja.com

1つのコンポーネントをモジュールから別のモジュールのコンポーネントにインポートする

angular 6を使用していて、mediaモジュールを持っています。MediaComponentMediaModuleでエクスポート)をインポートしたいのですが、これがありますエラー:

media.module"' has no exported member 'MediaComponent'.

これはMediaModule宣言です:

@NgModule({
  imports: [
    CommonModule,
    MediaRoutingModule,
    MaterialModule
  ],
  declarations: [LayoutComponent, MediaComponent],
  exports: [
    MediaComponent,
    CommonModule
  ]
})

これは別のモジュール宣言です:

@NgModule({
  imports: [
    CommonModule,
    MaterialModule,
    FormsModule,
    EM,
    EditorRoutingModule,
    MediaModule
  ],
  declarations: [ListComponent, CreateComponent, AddimageComponent]
})

別のモジュール(EditorModule)のコンポーネントから、これは私のインポートです:

import { MediaComponent } from '@app/views/media/media.module';

と私は例外を得た。

通知:を使用する場合media directiveEditorModuleのコンポーネントでは、作業ファイルです。例えば ​​<app-media></app-media>MediaComponentの内容を表示

4
hubert

確認してください media.module.tsMediaComponentクラスをエクスポートします。

export { MediaComponent } from 'path/to/media.component';

5
gerryc.inc

Angularの意味とJavaScriptの意味の両方)でMediaModuleからMediaComponentをエクスポートする必要があります。

モジュールの@NgModuleデコレータの 'exports'セクションを含めることで、Angularの意味でコンポーネントを既にエクスポートしましたが、export {MediaComponent}import { MediaComponent } from '@app/views/media/media.module';が機能するようにモジュールファイル。

また、モジュールから別のモジュールをエクスポートしないでください。MediaModuleの「exports」セクションから「CommonModule」を削除する必要があります。

だから、変更

@NgModule({
  imports: [
    CommonModule,
    MediaRoutingModule,
    MaterialModule
  ],
  declarations: [LayoutComponent, MediaComponent],
  exports: [
    MediaComponent,
    CommonModule
  ]
})
export class MediaModule {
}

に:

@NgModule({
  imports: [
    CommonModule,
    MediaRoutingModule,
    MaterialModule
  ],
  declarations: [LayoutComponent, MediaComponent],
  exports: [
    MediaComponent
  ]
})
export class MediaModule {
}

export {MediaComponent};
4
GreyBeardedGeek