Ngx-bootstrap弹出窗口显示在另一个位置

<ng-template #myModal>
  <div class="modal-header">
    <h4 class="modal-title">Modal Title</h4>
    <button type="button" class="close" aria-label="Close" (click)="modalRef.hide()">
      <span aria-hidden="true">&times;</span>
    </button>
  </div>
  <div class="modal-body">
    Modal Content
  </div>
</ng-template>

<button class="btn btn-primary" (click)="openModal(template)">Open Modal</button>

<ng-template #template>
  <div class="modal-dialog modal-dialog-centered">
    <div class="modal-content">
      <ng-container *ngTemplateOutlet="myModal"></ng-container>
    </div>
  </div>
</ng-template>

<button class="btn btn-primary" (click)="openModal(template, 'top')">Open Modal at Top</button>
<button class="btn btn-primary" (click)="openModal(template, 'bottom')">Open Modal at Bottom</button>
<button class="btn btn-primary" (click)="openModal(template, 'left')">Open Modal at Left</button>
<button class="btn btn-primary" (click)="openModal(template, 'right')">Open Modal at Right</button>

<ng-template #template>
  <div class="modal-dialog" [ngClass]="'modal-' + placement">
    <div class="modal-content">
      <ng-container *ngTemplateOutlet="myModal"></ng-container>
    </div>
  </div>
</ng-template>