如何解决用户在对话框外部单击时如何调用函数
我有“警报对话框”,并且有一个按钮“提示”以禁用“警报对话框”,以便在用户重新访问该站点时停止显示。
当用户在对话框外单击时,我的警报对话框也会关闭,所以我想知道当用户在对话框外单击以关闭警报对话框并在用户再次访问该对话框时停止显示时如何应用以上操作网站。
这就是我想要做的
用户单击外部警报对话框->关闭警报对话框->停用警报对话框(调用gotIt()函数)
对话框HTMl
<button mat-raised-button color="primary" [style.marginRight.px]="20" (click)="gotIt()" matTooltip="Close">Got
it!</button>
gotIt() {
for (let index = 0; index < this.notifications.length; index++) {
const notification = this.notifications[index];
if (notification && notification.userNotification) {
notification.userNotification.isDismissed = 1;
notification.userNotification.isUnread = 0;
}
}
this.notificationService.updateUserNotification(this.notifications).subscribe((response: any) => {
this.dialogRef.close()
})
}
解决方法
您可以简单地使用hostListener
收听此类事件
@HostListener('document:click',['$event']) click($event){
// here you can hide your menu
this.dialogRef.close();
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。