Question

我面临PrimeNG日历的问题。我进行了大量搜索，但未找到任何线索，并且这个问题已在StackOverflow中提出，但未给出正确的答案。

当我选择该日历之后的日期时，不会隐藏。

我的html代码：

<p-calendar [monthNavigator]="true" [yearNavigator]="true" yearRange="1910:2020" showButtonBar="true"  hideOnDateTimeSelect="true" showTime="true" dateFormat="mm-dd-yyyy"
              placeholder="mm-dd-yyyy"  [minDate]="yesterday" formControlName="Start"  class="pull-left">
            </p-calendar>

，然后将formControl绑定到此日历。

请帮我解决这个问题。

Answer 1

您必须进行以下更改才能为您工作，

在您的组件中，从@ angular / core导入ViewChild，从primeng / primeng导入Calendar

@ViewChild('myStartCalendar') startCalendar: Calendar;

ngOnInit() {
    this.calendarOnDateSelectHandler = this.startCalendar.onDateSelect;
    this.startCalendar.onDateSelect = ((event: any, dateMeta: any) => { 
    this.onStartDateSelectExtention(event, dateMeta); });
 }

private onStartDateSelectExtention(event: any, dateMeta: any): void {
    this.calendarOnDateSelectHandler.call(this.startCalendar, event, dateMeta);
    if (this.startCalendar.isSingleSelection()) {
        this.startCalendar.overlayVisible = false;
    }
}

然后将myStartCalendar放入html的primng日历中，如以下代码所示：

<p-calendar #myStartCalendar [monthNavigator]="true" [yearNavigator]="true" yearRange="1910:2020" showButtonBar="true"  hideOnDateTimeSelect="true" showTime="true" dateFormat="mm-dd-yyyy"
           placeholder="mm-dd-yyyy"  [minDate]="yesterday" formControlName="Start"  class="pull-left">
</p-calendar>

使用showTime选择日期后如何隐藏PrimeNG日历

1 个答案: