对话框中显示ng-pick-datetimer日历

Question

我已经使用了ng prime对话框，并尝试在其上添加ng-pick日期选择器，但是当单击日期选择器时，其隐藏在dialogbox.plz后面，我的代码是

<p-dialog   [contentStyle]="{'max-height':'190px' ,'max-width':'500px','width':'100%','height':'auto'}" header="Filter Columns" styleClass="quick-view-grid-row filterbox "   [(visible)]="displayFilter"
  appendTo="body" showEffect="fade" [modal]="true">
<div *ngIf="filterRow.datatype==='DateRange'">
        <!--<p-calendar [defaultDate]="currentdate"   timezone="utc"  styleClass="calender rightPadding" autofocus required="true" name="date" appendTo="body" [style]="{ 'width':'auto','z-index': '1089'}" [(ngModel)]="filterRow.values" [maxDate]="currentdate" [monthNavigator]="true" selectionMode="range" [placeholder]=filterRow.values [yearNavigator]="true" yearRange="2000:2030" showButtonBar="true" [showIcon]="true"></p-calendar>
      <span>{{currentdate}}</span> -->
      <input [(ngModel)]="filterRow.values" [owlDateTimeTrigger]="dt5" [owlDateTime]="dt5">
          <owl-date-time  #dt5></owl-date-time>

     </div>
</p-dialog>

Answer 1

解决了

我已经在main style.scss上添加了这个CSS

.cdk-overlay-container {
    position: fixed;
    pointer-events: none;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    display: flex;
    position: absolute;
    z-index: 9999999 !important;
}
.cdk-global-overlay-wrapper, .cdk-overlay-container {
    pointer-events: none;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    display: flex;
    position: absolute;
    z-index: 9999999 !important;
}