Angular 共享模块导出由另一个模块导入的组件

Question

我有 3 个模块。我们称它们为 StoreModule、BookModule、PaperModule。商店卖书，所以商店使用书。书是由纸组成的，所以用纸，和商店用的纸完全一样。商店也使用纸张。问题来了！现在 angular:

中的真实示例

paper.module.ts

import { NgModule } from '@angular/core';
import { PaperComponent } from './paper.component';

@NgModule({
  declarations: [
    PaperComponent
  ],
  exports: [
    PaperComponent
  ]
})
export class PapaerModule { }

目前一切顺利，没有 angular 错误。

book.module.ts

import { NgModule } from '@angular/core';
import { BookComponent } from './book.component';
import { PaperModule } from './paper.module'

@NgModule({
  declarations: [
    BookComponent
  ],
  imports: [
    PaperModule
  ],
  exports: [
    BookComponent
  ]
})
export class BookModule { }

在这里，book.component.html 看起来像这样：

<app-paper></app-paper>

一切都很好，没有错误。但是当我们想同时使用两者时（不确定我们是否需要两者，也许我们只需要纸，也许还需要书）：

store.module.ts

import { NgModule } from '@angular/core';
import { BookModule } from './book.module'
import { PaperModule } from './paper.module'

@NgModule({
  imports: [
    BookModule,
    PaperModule
  ]
})
export class StoreModule { }

这是我得到的错误：

Error: Uncaught (in promise): Error: Type PaperComponent is part of the declarations of 2 modules: BookModule and StoreModule! Please consider moving PaperComponent to a higher module that imports BookModule and StoreModule. You can also create a new NgModule that exports and includes PaperComponent then import that NgModule in BookModule and StoreModule.

我怎样才能一路构造它，以便导出两个组件（BookComponent 和 PaperComponent），以便我可以在其他模块中使用它们？我想让 BookModule 和 Storemodule 也可以重用 PaperComponent。对于某些模块，我只需要纸张，但对于其他一些模块，我还需要包含纸张的书。希望你能理解我的问题！

Answer 1

我只是运行通过 stackblitz 你的设置，没有问题。

检查您的代码以确保 BookModule 没有声明 PaperComponent。

book.module.ts

import { NgModule } from '@angular/core';
import { BookComponent } from './book.component';
import { PaperModule } from './paper.module';
import { PaperComponent } from './paper.component';

@NgModule({
  declarations: [
    BookComponent,
    // This would be a problem
    PaperComponent
  ],
  imports: [
    PaperModule
  ],
  exports: [
    BookComponent,
  ]
})
export class BookModule { }

Angular 共享模块导出由另一个模块导入的组件

Angular shared module exports component imported by another module

typescript

angular

shared-module