angular - 捕捉解雇事件 ngx-bootstrap 模态

Question

关闭。这个问题需要details or clarity .它目前不接受答案。












想改进这个问题？通过 editing this post 添加详细信息并澄清问题.


1年前关闭。







Improve this question




我正在使用 Angular 6 和 ngx-bootstrap 3.0.1
我显示一个模态，并且我希望能够在用户在更新表单后尝试关闭模态时显示丢弃/取消确认。
当用户使用我的自定义关闭按钮时我没有问题，但是当他在模式外使用背景点击时我不知道如何调用我的关闭函数。
如何干净地处理背景点击以显示我的确认消息？

Answer 1

使用选项打开您的模式

this.bsModalRef = this.modalService.show(ExampleModal, {
  ignoreBackdropClick: true,
  keyboard: false
});

在 ExampleModal 中放置此代码

ngOnInit(): void {
     document.documentElement.addEventListener('click',  this.hideIfIsBackdropClick.bind(this)); 
}

hideIfIsBackdropClick(event: any): void {
     if (event.target.classList.contains('modal')) {
        this.hide();
     }
}

hide(): void {
   if (anyBooleanHere) {
      this.bsModalRef.hide();
   }
}