问题标签 [primeng-dialog]

这是一个更大的项目的一部分，我试图通过这个例子来简化它。我使用 PrimeNg 巴比伦主题。我有一个父组件，它有一个 for 循环，它为每次迭代生成一个按钮和一个带有对话框的子组件。单击此按钮会激活 PrimeNg 对话框。但是由于它是一个按钮和对话框的循环，因此单击这些按钮中的任何一个都会打开每个对话框。（共 3 个）。问题是我不知道如何在单击按钮时定位，只有它是从父组件到子组件的相关对话框，而不是所有按钮。我是 Angular 的新手。有人可以帮忙吗？app.component.html 父组件的代码是：

app.component.ts 的代码是：

child.component.html 的代码是：

child.component.ts 的代码是：

我正在使用 Primeng Dialogue，里面有一个表单。表单有一个取消按钮，我在其中传递表单（ngForm）变量以检查表单是否处于脏模式。如果它处于脏模式，我将显示一个确认对话。如果用户点击 Primeng Dialogue 中的“X”按钮，也会发生同样的事情。当我单击“取消”按钮时，我得到了 NgForm，但是当我在（onHide）函数（如（onHide）=“取消（f）”）中传递表单变量时，NgForm 数据在取消（表单：NgForm）函数上变得未定义. 当表单在此对话框中时，如何在 Primeng Dialogue 的（onHide）函数中传递表单变量？

HTML：

取消按钮功能：

我正在使用primeng confirmDialog，它需要我的Angular 10项目中的confirmationService，但在localhost：4200上没有显示任何内容，并且我在Chrome控制台中收到以下错误。

这是我的 app.component.ts。

这是 app.component.html

谢谢

如果用户未经授权（状态 == 401），我想显示 PrimeNG 动态对话框。但是如果我想打开对话框，我会得到一个错误：

我通过将 DialogService 添加到根的模块提供程序解决了这个问题：

但我不确定这是否正确，因为正如官方文档中所写，每个组件都应该有自己的 DialogService 提供程序。但是因为我需要其他服务（UnauthorizedHttpInterceptor）中的 DialogService，所以我必须将 DialogService 包含到根提供程序列表中。那是对的吗？

拥有自己的提供者的所有其他组件：

将使用他自己的实例。

所以我的解决方案应该没有问题吗？如果是这样，将 DialogService 实例提供给拦截器的正确方法是什么？

我的主要目标是避免多个 DialogService 组件发生冲突，以便成功打开/关闭多个对话框。

有没有办法为动态对话框定义自定义标题模板？

对于普通对话框，您可以使用自定义 html 代码定义 p-header 标记。

但我没有找到任何方法来为动态对话执行此操作。

我正在使用 PrimeNG，我想以编程方式显示模式对话框。我知道我应该DialogService为此目的使用 。然而，它的第一个参数需要一个组件。当我们想要创建一个在其主体内具有动态内容的复杂对话框时，这很实用。

但是我只想显示这样一条简单的短信

如何使用 primeNG 实现这一点？

我使用 PrimeNG 的动态对话框。

如何通过单击对话框周围的“无处”区域来强制关闭对话框？目前我只能通过使用对话框中的按钮来关闭对话框。

我正在努力在primeng包的“p-dialog”部分添加复选框。但是，我遇到了 UI 问题，当我尝试从 UI 手动取消选中复选框时，它也不起作用，更改或单击事件也不会触发。在与复选框相关的部分代码下方发布。有人可以建议需要修复什么才能使其正常工作。

html代码

组件代码

我正在处理需要用谷歌材料图标替换对话框面板的关闭图标的要求。

找到下面的截图，我想用谷歌素材图标替换关闭图标。

对话框截图

以下代码生成带有一些自定义消息的对话框。

添加谷歌素材图标的示例如下。

但是对话框会自动使用它的默认 css 和 html 组件呈现。

为对话框生成代码

有人可以指导我如何用谷歌材料图标覆盖对话框的关闭图标。

提前致谢。

在我的Ace-PrimeNg-Testproject中，我从我的主项目 ( Webmud3 ) 中提取了包括问题在内的功能。在 angular 12.2.1、primeng 12.1.0-rc.1 和 ace-builds@1.4.12 中实现。

通过该测试项目，我设法解决了一些调整大小的问题，但是当我将其调整为更小时，primeng p-dialog 中会出现滚动条，并且 ace 编辑器不再调整大小，请参阅. 安装 node.js 后，很容易克隆和测试 ace-primeng-project。非常感谢任何帮助或其他改进。

Update-1：一开始我尝试获取 p-dialog 的内部大小，但 resize-end 事件似乎是转发的鼠标事件并且不包含信息

更新 2：我现在有一个解决方案，它并不完美，但可以工作。我已经相应地更新了这两个项目。