将ngx-boostrap整合到您的项目中的最佳实践是什么

import { ModalModule } from 'ngx-bootstrap/modal';

import { ModalModule } from 'ngx-bootstrap/modal';

@NgModule({
  imports: [
    // 其他模块
    ModalModule.forRoot()
  ],
  // 其他配置
})
export class AppModule { }

<button type="button" class="btn btn-primary" (click)="openModal()">打开模态框</button>

<ng-template #myModal>
  <div class="modal-header">
    <h4 class="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">
    模态框内容
  </div>
</ng-template>

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

@Component({
  // 组件配置
})
export class MyComponent {
  modalRef: BsModalRef;

  constructor(private modalService: BsModalService) {}

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