Модальное окно Ngx-bootstrap открывается дважды, а не один раз

Я пытаюсь отобразить несколько разных модальных окон на своей панели инструментов, но заметил, что в большинстве случаев модальный экран открывается дважды. (Я даже не могу последовательно воспроизвести эту проблему, поскольку иногда он НЕ открывает два модальных окна после того, как я отменяю ng serve и запускаю его снова в первый раз. Автоматическая перекомпиляция ng serve после изменений на 100% всегда приводит к появлению двух модальных окон).

Я вызываю модальную функцию (щелчок) на моей панели инструментов, которая выглядит так

openConfigureModal(soort: string){
this.dashboardService.openConfigureModal.next(soort);

Вся услуга - это просто

  @Injectable()
  export class DashboardService {
  constructor() { }
  openConfigureModal = new Subject();
} 

В модальном компоненте я открываю два разных шаблона (сначала я делал это в двух разных компонентах вместе, затем возникла проблема, и я подумал, может быть, это решит ее, но этого не произошло)

export class ConfigureAppModalComponent implements OnInit {

  constructor(private dashboardService: DashboardService, private modalService: BsModalService) { }

  modalRef: BsModalRef;
  @ViewChild("templateConfigure") template;
  @ViewChild("templateSync") template2;

  ngOnInit() {
    const config = {
      class: 'modal-dialog-centered modal-lg',
    };

    const config2 = {
      class: 'modal-dialog-centered roundedborder modal-sm',
    };

    this.dashboardService.openConfigureModal.subscribe( data => {
      if(data == "google"){
        //set some values
        this.modalRef = this.modalService.show(this.template, config);
      }else if(data == "outlook"){
        //set some values
        this.modalRef = this.modalService.show(this.template, config);
      }else{
        this.modalRef = this.modalService.show(this.template2, config2);
      }
    })
  }

С шаблонами, просто похожими на это

<ng-template #templateConfigure>
  <div class="modal-header">
    sth here
  </div>
  <div class="modal-body">
    sth here
  </div>
</ng-template>


<ng-template #templateSync>
  <div class="modal-header">
    sth else here
  </div>
  <div class="modal-body">
    sth else here
  </div>        
</ng-template>

Я также показываю компонент только один раз в моем dashboard.component.html вот так

<app-configureappmodal></app-configureappmodal>

Ngx-bootstrap версии 2.0.2 Bootstrap версии 4.0.0

Любые другие непонятные вещи, не стесняйтесь спрашивать. Спасибо за чтение!