web-dev-qa-db-ja.com

モジュールはコンポーネントをローカルに宣言しますが、エクスポートされません

私は共有モジュールを作成し、他のモジュールに必要なコンポーネントを宣言してエクスポートしました。

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { DateslideComponent } from './dateslide/dateslide.component';
import { IonicModule } from '@ionic/angular';
import { TimeslideComponent } from './timeslide/timeslide.component';
import { AddtimeComponent } from './addtime/addtime.component'

@NgModule({
   declarations: [DateslideComponent, TimeslideComponent, AddtimeComponent],
   imports: [
       CommonModule,
       IonicModule
   ],
   exports: [DateslideComponent, TimeslideComponent, AddtimeComponent]
})
export class TimeModule { }
 _

別のモジュールでは、共有モジュールをインポートしました。

 import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';

import { IonicModule } from '@ionic/angular';

import { WhenPageRoutingModule } from './when-routing.module';

import { WhenPage } from './when.page'; 
import {TimeModule} from '../../timemodule/time.module';

@NgModule({
  imports: [
    CommonModule,
    FormsModule,
    IonicModule,
    WhenPageRoutingModule,
    TimeModule
  ],
  declarations: [WhenPage ]
})
export class WhenPageModule {}


 _

他のモジュールのいずれかのコンポーネントで、私は共有モジュールからコンポーネントをインポートしましたが、私は以下のエラーを受け取ります

import { AddtimeComponent } from '../../timemodule/time.module'
 _

モジュールはコンポーネントをローカルに宣言しますが、エクスポートされません。

angulartypescriptionic-frameworkionic4ng-modules
4
earlyBirdDev

コンポーネントを再度インポートする必要はありません。他のモジュールにSharedModuleをインポートし、SharedModuleでエクスポートされたコンポーネントを使用することは自由に感じます。

_import { SharedModule } from '/path/to/SharedModule';

@NgModule({
  imports: [
    ...
    SharedModule
  ]
})
_

このセットアップをスタックブリッツで複製したり、問題をデバッグしたり、解決策を提供できるようにするために、リポジトリへのアクセスを共有してください。

モジュールのビルドプロセス内のコンポーネントをbootstrapをしようとしているので。その後、EntribeComponentを使用して、ロードされたモジュールのbootstrapからコンポーネント自体を提供する必要があります。

コードでそれを見てください：

_
import { SharedModule } from '/path/to/SharedModule';
import { AddtimeComponent } from '/path/to/AddtimeComponent';

@NgModule({
  imports: [
    ...
    SharedModule
  ],
 entryComponents: [
    AddtimeComponent
  ]
})

_

詳細については、チェックアウト: https://codinglatte.com/posts/angular/entry-components-angular/

2
Ruslan Gonzalez