如何从 1 个角度库与另一个库进行通信？答案

【问题标题】：How to communicate from 1 angular library to another?如何从 1 个角度库与另一个库进行通信？
【发布时间】：2019-08-24 12:11:14
【问题描述】：

我有这个 Angular 应用程序，它基本上使用了库的概念。

我有 2 个名为 Lib1 和 lib2 的库，根据它们所服务的微服务进行分组。

现在我将这些库导入到主应用程序中，即 App1 直到现在。

现在，Lib1 有一个组件 UploadComponent 负责上传所有类型的媒体文件视频、图像、Docs 等。在 App1 中使用组件选择器或通过路线加载。

Lib2 有一个组件 CreateComponent 需要上传功能，所以我导入 UploadComponent 并在模态窗口中调用它。但是在上传完成后，这个组件会发出一些消息，但我无法捕捉到，因为 Createcomponent 和 UploadComponent 位于不同的库中。

有谁知道如何处理这种情况？

【问题讨论】：

您可以为此实现发布-订阅模式。创建一个服务，它将从任何地方发布一个事件，任何人都可以订阅该事件。
谢谢@JoharZaman 我已经在uploadComponent 所在的Lib1 中实现了pub-sub 模式，但无法在Lib1 中发布并在Lib2 中订阅。您能否分享代码如何使用 pub-sub 模式进行跨库通信？
您可以创建一个服务类并将其实例导出为变量，以便您可以在任何地方导入它。例如：javascript export class EventsServiceFactory { constructor() { } } export const EventsService = new EventsServiceFactory(); 这样就可以在任何地方导入 EventsService。
EventsServiceFactory 可以有两个函数publish('name of event') 和subscribe('name of event')。你可以做的是在uploadComponent中上传完成后你可以发布一个事件（名称为'UploadCompleted'），你可以在其他组件中订阅'UploadCompleted'事件。
@JoharZaman 但这种方法不适用于图书馆之外

【解决方案1】：

您可以通过两种不同的方式通过两个不同的微应用程序进行通信，或者称为 Angular 库。请按照以下步骤操作：-

第二种方法是从一个组件发出事件，该事件可以监听到另一个组件或库模块。

从一个组件调度事件：-

 document.dispatchEvent(
  new CustomEvent(name, { detail: body })
);

在另一个组件中监听事件

  document.addEventListener(name, handler);

希望对您有所帮助。

【讨论】：