ngx-bootstrap modal的单实例问题

Question

我从 ngx-bootstrap modal 开发了三个不同的组件 1. 模态 2. iFrame 模态 3. Alertbox 模态

我只是在这些组件中传递模板并渲染它。

但是当我在单个模板中使用任意两个时，问题就来了。共享相同的实例。所以当我隐藏一个模态时，其他模态输出隐藏也会触发。

我认为这是由于相同的 BsModalService 服务利用率。 那么有什么解决办法吗？

<app-new-modal (hidden)="onModalHidden()">
<div heading>Heading</div>
</app-new-modal>
<app-iframe-modal #iframe (hidden)="onIframeHidden()">
<div heading>Heading</div>
</app-iframe-modal>

Answer 1

尝试实例化与该特定组件相关的服务。由于您正在订阅模式关闭并发出事件，因此这似乎会调用所有场景，而不管该特定组件如何。希望这会有所帮助:)

@Component({
  selector: 'app-modal',
  templateUrl: './modal.component.html',
  styleUrls: ['./modal.component.css'],
  providers: [BsModalService]
})

---------------------------------------------------------

@Component({
  selector: 'app-alertbox',
  templateUrl: './alertbox.component.html',
  styleUrls: ['./alertbox.component.css'],
  providers: [BsModalService]
})