时间戳

首页 > 解决方案 > 具有 Primeng 动态对话框的多个服务相互干扰

angular - 具有 Primeng 动态对话框的多个服务相互干扰

问题描述

我正在努力解决 angular/primeng 问题。我在不同的模块中有两个服务，每个模块都使用 DialogService 创建一个 DynamicDialog 组件。

我已经读过，如果您同时有多个模式，您需要单独的 DialogService 实例。我试图通过将每个服务放在它们自己的模块中并将 DialogService 放在每个模块的“提供者”部分来实现这一点。

每个模态本身都可以正常工作，但是我遇到了两个模态同时显示的情况。在这种情况下，在我关闭第二个模式后，我无法关闭第一个模式，即使关闭代码被触发并返回结果。

这个问题的一个例子的 stackblitz 是：

https://stackblitz.com/github/thomasesh/twomodalproblem

任何帮助将不胜感激。

标签： angularprimeng

解决方案

原因是角度DI。你在 app-module 中导入了 module-a 和 module-b。他们都提供DialogService。并且由于 DI 的工作方式，创建了服务的 SINGLE 实例。这是 imo primeng 错误，但要解决它，您可以创建一个令牌并使用令牌提供（并注入）服务的第二个实例，而不是使用相同的服务实例

// token.ts
export const DialogServiceToken = new InjectionToken('DialogService');
//module-b.ts

providers: [
 { provide: DialogServiceToken, useClass: DialogService} // this will register second instance of DialogService
]

//module-b.service
constructor( @Inject(dialogServiceToken) private dialogService: DialogService) {} // here we inject the second instance of a service

推荐阅读