Ngx Bootstrap Template Modal Destroyed / Removed From Dom When Hidden

Question

import { Component, TemplateRef } from '@angular/core';
import { BsModalService } from 'ngx-bootstrap/modal';
import { BsModalRef } from 'ngx-bootstrap/modal/modal-options.class';

@Component({
  selector: 'demo-modal-service-static',
  templateUrl: './service-template.html'
})
export class DemoModalServiceStaticComponent {
  public modalRef: BsModalRef;
  constructor(private modalService: BsModalService) {}

  public openModal(template: TemplateRef<any>) {
    this.modalRef = this.modalService.show(template);
  }
}

Create template modal

<template #template>
  <div class="modal-header">
    <h4 class="modal-title pull-left">Modal</h4>
    <button type="button" class="close pull-right" aria-label="Close" (click)="modalRef.hide()">
      <span aria-hidden="true">&times;</span>
    </button>
  </div>
  <div class="modal-body">
    This is a modal.
  </div>
</template>

http://valor-software.com/ngx-bootstrap/#/modals#directive-section

Hi, as seen above, creating modal with template will destro the template when, it is hidden. However; I don't want to be hidden. That is because, I use the modal for selecting some property multiple times from a list. Thus, every time, I have to load the modal. That causes a performance issue. Thus, Is there any way to stop it removing the modal from the dom.