Close date range calendar component after choosing two dates

Question

PrimeNg delivers really good Calendar component which works really fine, but is there a way to close it after choosing 2 dates?

<p-calendar [(ngModel)]="rangeDates" 
            selectionMode="range"
            [readonlyInput]="true"></p-calendar>

In documentation I noticed two interesting things as: - Event onSelect, unfortunately it would've work on normal calendar, where we do one press (here we need to press twice) - Property: hideOnDateTimeSelect, but it seems like it isnt what I'm looking for, because it doesn't work either.

I think i could've do something like:

<p-calendar [(ngModel)]="rangeDates" 
            selectionMode="range"
            [readonlyInput]="true"
            (onSelect)="onSelect()"></p-calendar>

private dateSelected() {
    if (this.rangeDates[0] !== null && this.rangeDates[1] !== null) {
    //really dont know how to do "close" right now.
    }
}

Answer 1

The below worked for me:

<p-calendar [(ngModel)]="rangeDates" 
    selectionMode="range" #calendar
    [readonlyInput]="true"
    (onSelect)="onSelect()"></p-calendar>

@ViewChild('calendar', undefined) private calendar: any;
private onSelect(){
  if (this.rangeDates[1]) { // If second date is selected
    this.calendar.overlayVisible=false;
}
 }

I know it is pretty late to answer your question, but still answered it for people like me who are tryin to find an answer to this.