我正在开发一个使用Angular 7的项目,我为我构建的应用程序的各个模块提供了各种角度库,然后在(私有)npm上发布以供应用程序使用 . 因此,所有角度库都通过他们的npm包导入到应用程序中 .
我面临的问题是我现在有2个模块相互导入,因为它们需要显示来自其他模块的组件 . 我无法在其他地方移动所述组件,因为它们依赖于自己模块中的服务和其他组件 .
为了让它更清晰一点,我会举一个例子说明我的情况 .
我已经有一个 SharedModule
,其中包含一些在其他模块中使用的独立组件,然后我还为每个API服务都有一个模块 . 所以我有 UsersModule
,'AdministrationModule'等 . 我的问题是 PlantModule
和 FleetModule
.
-
在发电厂的工厂
-
舰队在一组植物和/或其他舰队中,但也有自己的属性
PlantModule
有植物清单的组成部分(如发电厂而非有机植物)和植物细节的组成部分 . 在详细信息组件中还有其他外部组件,例如显示分配给它的所有用户以及车队 .
FleetsModule
还有一个用于车队列表的组件和一个用于详细信息的组件 . 在这个细节组件中,还有外部组件,如分配的用户,子车队列表和作为车队一部分的工厂列表 .
我要做的是在其他模块中使用可重用的组件,这样我就不需要复制粘贴所有API服务,组件等 .
关于我做错了什么或如何解决它的任何想法?
更新
为了解决这个问题,我改变了需要这些组件的“页面”的结构 . 因此,我不是在库中的其他组件中导入可重用组件,而是在主应用程序中创建一个包装器视图,并导入我需要的所有内容 .
1 回答
所以你有三个模块,
DeskModule
,UsersModule
和OfficeSuppliesModule
.DeskModule
导入UsersModule
和OfficeSuppliesModule
,因为它有两个在该模块的Component中显示它们的组件 .问题是在
OfficeSuppliesModule
中你有一个来自DeskModule
的组件来显示它属于哪个桌面 .我不明白为什么你有一个组件只是为了表明这一点?您可以利用可以在
CoreModule
中使用的服务来代替组件 . 通过此服务,您可以公开一种方法,以告知OfficeSuppliesModule
组件的模板,这些办公用品属于哪个办公桌 . 既然不会面对这个问题 .您可以做的另一件事是将您在
DeskModule
和OfficeSuppliesModule
中使用的组件移动到SharedModule,然后将SharedModule
添加到DeskModule
和OfficeSuppliesModule
的imports
数组中更新
从Angular 6开始,您可以将
providedIn: 'root'
添加到@Injectable
装饰器,而不是将服务名称添加到模块的providers
数组中 . 这样,服务就会注册到root
注入器,并且可以通过App获得 .因此,您可以通过将
providedIn: 'root'
添加到这些服务的@Injectable
装饰器中来更改您在多个模块中所需的所有服务:然后,如上所述,此更新将
PlantModule
和FleetsModule
中使用的组件移动到SharedModule
.