Проблема единственного экземпляра модального ngx-bootstrap

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]
})