angular - 在 p-dialog 上打开fancy-box 时,关闭 PRIMENG 的 p-dialog 退出问题

标签 angular fancybox primeng

我在关闭 p 对话框和花式框时遇到问题。当两者都打开时,两者都在按下逃生键时关闭。

流程是:

  • 当我打开 p-dialog 时,我在 p-dialog 中有一个图像
  • 当我点击图片时,fancy-box 是打开的
  • 然后我按退出
  • 两者均已关闭

  • 我想在按下退出时一一关闭,而不是一键按下。

    最佳答案

    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;
    }
    

    希望这会帮助你。

    关于angular - 在 p-dialog 上打开fancy-box 时,关闭 PRIMENG 的 p-dialog 退出问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55662325/

    相关文章:

    angular - 执行插值,即使 ChangeDetectorRef 已分离

    angularjs - 组件内部的 Angular2 表单验证

    javascript - 如何从另一个 div 内容绑定(bind) fancybox 内容?

    javascript - 从 iframe 关闭 fancybox

    javascript - Primeng 确认对话框在服务中不起作用

    css - 样式不是从 angular.json 样式数组 angular 6 中挑选的,但是在 styles.css 中可以很好地导入

    chart.js - 如何使用PrimeNg的宽度和高度图表?

    javascript - 在 Angular 中组合不重复的数组

    angular - 创建下拉组件

    mobile - 在媒体查询的视口(viewport)内禁用 fancybox