首页 > 解决方案 > Bootstrap 4模式消失后背景仍然存在

问题描述

我正在使用 bootstrap 4 模态,当我单击“确定”按钮时,我调用函数,然后模态消失,但背景仍然存在。而对于关闭按钮,模态和背景会消散它,因为我使用的是“data-dismiss =”modal”,但是如果我对“Ok”按钮使用相同的,这不起作用。我用过(数据背景="false"),但它完全删除了我不想要的背景。所以有人可以告诉我该怎么做。我已经上传了以下代码。

<div class="modal" tabindex="-1" role="dialog" id="myModal">
<div class="modal-dialog" role="document">
  <div class="modal-content">
    <div class="modal-header">
      <h5 class="modal-title">{{title}}</h5>
      <button type="button" class="close" data-dismiss="modal" aria-label="Close">
        <span aria-hidden="true">&times;</span>
      </button>
    </div>
    <div class="modal-body">
      <p>{{question}}</p>
    </div>
    <div class="modal-footer">
      <button type="button" class="btn btn-primary" (click)="onConfirm($event)">Ok</button>
      <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
    </div>
  </div>
</div>

.ts 文件

export class ModalComponent  {
@Input() question: string = ''
@Input() title: string = ''
@Output() confirm = new EventEmitter<void>() 
constructor() { }
onConfirm(event: Event) {
event.stopPropagation()
this.confirm.emit()
}

}

标签: htmlangularbootstrap-modal

解决方案


推荐阅读