angular - ngx-bootstrap modal的单实例问题

Question

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

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

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

我认为这是由于相同的 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]
})