Bootstrap modal with angular。模式未使用特定的data-ng-click函数关闭

<!-- 组件的HTML模板 -->
<button (click)="openModal()">打开Modal</button>

<ng-template #content let-modal>
  <div class="modal-header">
    <h4 class="modal-title">Modal标题</h4>
    <button type="button" class="close" aria-label="Close" (click)="modal.dismiss()">
      <span aria-hidden="true">&times;</span>
    </button>
  </div>
  <div class="modal-body">
    Modal内容
  </div>
  <div class="modal-footer">
    <button type="button" class="btn btn-secondary" (click)="modal.close()">关闭</button>
  </div>
</ng-template>

// 组件的Typescript代码
import { Component, ViewChild } from '@angular/core';
import { NgbModal } from '@ng-bootstrap/ng-bootstrap';

@Component({
  selector: 'app-example',
  templateUrl: './example.component.html',
  styleUrls: ['./example.component.css']
})
export class ExampleComponent {
  @ViewChild('content') modalContent: any;

  constructor(private modalService: NgbModal) { }

  openModal() {
    this.modalService.open(this.modalContent);
  }
}