有什么方法可以强制打开模态

时间:2019-11-14 13:47:42

标签: html css angular primeng

我有一个带有p日历的p对话框。问题是,当我尝试打开日历时,它向上打开。我想向下打开。

<p-dialog responsive="true" modal="true" (onHide)="closeDialog()" #genericDialog 
   [(visible)]="displayModal"
   class="generic-dialog">

    <div *ngSwitchCase="'DATE_CUSTOM'" class="form-group form-control-head"
    [class.has-success]="formGroup.controls ? formGroup.controls[control.name].valid : false">
    <p-calendar [monthNavigator]="true" [yearNavigator]="true" [yearNavigator]="true" 
                [showTime]="false"
                [minDate]="dateMin" [maxDate]="dateMax" yearRange="2000:2030" dateFormat="dd/mm/yy" 
                [showIcon]="true"
                [style]="{'width': '95%'}" [inputStyle]="{'height': 'calc(1.5em + 0.75rem + 4px)', 
                'width': '100%'}"
                [formControlName]="control.name" [showButtonBar]="true" [locale]="calendarLang">
    </p-calendar>
  </div>
   <br>
  <p-footer>
     <div class="col-12 text-center mb-4">
        <button [disabled]="formGroup.invalid" (click)="submit()"
         class="btn btn-primary px-4">Save
         </button>
        &nbsp;&nbsp;&nbsp;
       <button type="button" class="btn btn-info px-4" (click)="closeDialog()"
             style="color: white">Cancel
       </button>
    </div>
  </p-footer>

</p-dialog>

1 个答案:

答案 0 :(得分:2)

很久以前,我也遇到过同样的问题。我会直接说您不能强迫p日历向下或向上打开。

因为这取决于p日历输入框的上方和下方的可用空间。

因此,要手动向上打开,请在输入框中保持向上的空间,而在向下的方向上保留较小的空间。

那样您可以实现,希望对您有所帮助!