1

「ボタン モジュール」という名前のモジュールに、「製品モジュール」という名前の独自のカスタム モジュールで使用したい特定のコンポーネントがあります。ボタン モジュールのコンポーネントは「ドロップダウン ボタン」コンポーネントです。共有モジュール ファイルを作成してから、これらのコンポーネントをそのモジュールにエクスポートする必要があることはわかっています。しかし、共有モジュールを作成するかどうかわからないので、少し混乱していますが、両方のモジュール、つまりボタンと製品モジュールの宣言にこれらのコンポーネントを追加する必要がありますか? 共有モジュール ファイルをモデル化するのに最適な方法は何ですか? ここに私のコードがあります

buttons.module.ts

const components = [
  ButtonsComponent,
  DefaultButtonsComponent,
  HeroButtonComponent,
  ShapeButtonsComponent,
  SizeButtonsComponent,
  ActionGroupsComponent,
  DropdownButtonsComponent,
  BlockLevelButtonsComponent,
  ButtonGroupsComponent,
  IconButtonsComponent,
  LabeledActionsGroupComponent,
];

@NgModule({
  imports: [
    ThemeModule
  ],
  exports: [
    ...components,
  ],
  declarations: [
    ...components,
  ],
  providers: [],
})
export class ButtonsModule { }

products.module.ts

@NgModule({
    imports: [ 
        ThemeModule,
        NbCardModule,
        FormsModule,
        ProductsRoutingModule,
        // DropdownButtonsComponent,
    ],
    declarations: [
        ProductsComponent,
        AllproductsComponent,
        AddproductComponent,
    ]
})

export class ProductsModule { }
4

1 に答える 1

2

いいえ、2 つのモジュールの宣言リストにコンポーネントを追加することはできません。エラーがスローされます。このコンポーネント専用のモジュールを作成し、他のモジュールにインポートすることができます。

@NgModule({

  exports: [
    DropdownButtonsComponent,
  ],
  declarations: [
    DropdownButtonsComponent,
  ],
  providers: [],
})

export class DropdownButtonsModule { 
}

ボタンモジュール

@NgModule({
  imports: [
    ThemeModule,
    DropdownButtonsModule 
  ],
  exports: [
    ...components,
  ],
  declarations: [
    ...components,
  ],
  providers: [],
})
export class ButtonsModule { }

製品モジュール

@NgModule({
    imports: [ 
        ThemeModule,
        NbCardModule,
        FormsModule,
        ProductsRoutingModule,
        DropdownButtonsModule ,
    ],
    declarations: [
        ProductsComponent,
        AllproductsComponent,
        AddproductComponent,
    ]
})

export class ProductsModule { }
于 2019-08-26T09:38:04.357 に答える