跨多个 Angular 5 应用程序共享单个服务答案

【问题标题】：sharing a single service across multiple angular 5 applications跨多个 Angular 5 应用程序共享单个服务
【发布时间】：2020-07-01 21:00:27
【问题描述】：

我在我的后台应用程序中运行多个小型 angular 5 应用程序作为小部件。现在我正在尝试编写一个全局服务，它处于窗口级别，并在所有应用程序之间共享。

目前，我将服务设为静态并在每个小部件中使用，并使用 webpack 创建特定于小部件的捆绑包。在这里，我能够使用 rxjs 操作符实现 http 缓存。

但我觉得这可能不是实现它的正确方法。有没有更好的方法在单个项目中跨多个 Angular 5 应用程序共享单例服务。

【问题讨论】：

你的代码在github吗？看一看以了解您的架构会很有帮助。
是否可以将 Angular 5 升级到 6？因为在版本 6 中有一个 Angular 库功能非常适合您的目的。你可以查看there

标签： angular angular5 backbase

【解决方案1】：

以前，如果您想在多个 Angular 项目之间共享一些东西，这非常棘手。您必须执行以下操作之一：

创建包含共享代码的包并将其发布到私有或公共 NPM 注册表
创建一个 GIT 子模块并在您的两个项目中引用它

但现在我猜 Angular 6 中引入的 Library 支持最适合您的需求。

详情见： Angular - Creating Libraries

将您的共享包发布到 NPM 与此类似，但 Angular CLI（和 ng-packagr）确实让它变得超级简单。

【讨论】：

【解决方案2】：

从技术上讲，您的一个模块（“主”模块）可以通过window 对象导出自己的服务，其他模块（“客户端”）可以注入包装服务：

class ServiceWrapper implements IService
{
    private readonly instance:IService;

    constructor(){
        this.instance = window['myService'] as IService;
    }

    public someMethod():void {
         this.instance.someMethod();
    }
}

【讨论】：

你能提供更多的代码吗？如何导出和导入？

【解决方案3】：

根据定义，服务是单例的，因此如果您需要在项目中跨多个应用程序使用服务，您真正需要做的就是在项目的根目录中定义它，并将其导入每个 app.module .这里有点不正统的是使用多个应用程序的想法。也许您真正需要的是一个应用程序，其中包含您的解决方案所需的尽可能多的模块。但是话又说回来，如果不看你的架构，我不能准确地说出任何话，所以如果你想分享你的代码，也许我可以看看它并提出建议。

干杯！

【讨论】：