AngulaR语言 Primeng的confirmDialog显示在ng-bootstrap的模态后面

Question

我正在使用priming和ng引导程序组件制作一个具有angular的网站。

为了获取信息，我在ng引导模式中使用了一个表单。当点击该模式的"保存"按钮时，应显示priming confirmDialog。问题是它出现在模态后面。

我该怎么修？

这是我的一些HTML:

<p-confirmDialog header="Confirmation" icon="pi pi-exclamation-triangle" width="425" appendTo="body"></p-confirmDialog>
<ng-template #modalFormOrder let-c="close" let-d="dismiss" id="modalFormOrder">
<div class="modal-header">
...
</div>
<div class="modal-body">
...
</div>
<div class="modal-footer">
<button type="button" class="btn btn-light" (click)="c('Close click')">Close</button>
<button type="button" class="btn m-btn--pill m-btn--air btn-success" (click)="SaveEditLoadOrder()">Save</button>
</div>
</ng-template>

Answer 1

我确信这两个对话框都使用z-index CSS属性对于要首先出现的元素，使用较大的数字覆盖z-index CSS属性，例如z-index:1001；

如果你想覆盖PrimeNG的Css，我建议你把它写在/src/styles.Css上

.ui-calendar {
width: 100%;
height: 100%;
}

在PrimeNG文档中，您可以找到要为每个组件覆盖的CSS类