当在 p-dialog 上打开 fancy-box 时，关闭 PRIMENG 的 p-dialog 以解决逃生问题

Question

我在关闭 p-dialog 和 fancy-box 时遇到问题。当两者都打开时，两者都在按下退出键时关闭。

流量为：

当我打开 p-dialog 时，我在 p-dialog 中有一个图像
当我点击图片时，fancy-box 是打开的
然后我按退出键
两者都关闭了

我想在按下 Escape 时一一关闭，而不是一键关闭。

Answer 1

prime-ng Dialog中有closeOnEscape 属性。您可以使用此属性在退出时关闭对话框。

最初将其设为假。当第一个对话在逃跑时接近时。为逃逸事件添加 HostListener 并将 closeOnEscape 更改为 true。

这样一一关闭对话框。

示例：

在 HTML 中：

 <p-dialog closeOnEscape="closeDialog">
        <p-dropdown appendTo="body"></p-dropdown>
    </p-dialog>

在 ts 中：

closeDialog : boolean = false;

@HostListener('document:keydown.escape', ['$event']) onKeydownHandler(event: KeyboardEvent) {
    console.log(event);
    this.closeDialog = !this.closeDialog;
}

希望这对您有所帮助。

当在 p-dialog 上打开 fancy-box 时，关闭 PRIMENG 的 p-dialog 以解决逃生问题

Close p-dialog of PRIMENG on escape issue when fancy-box is open on p-dialog

fancybox

primeng

angular