Angular ngb-datepicker close() when both dates are selected

I have implemented ng-bootstrap date range component

<input
name="datepicker"
ngbDatepicker
#datepicker="ngbDatepicker"
[autoClose]="'inside'"
(dateSelect)="onDateSelection($event)"/>

<input
name="dpFromDate"
type="text"
#dpFromDate
(input)="fromDate = validateInput(fromDate, dpFromDate.value)"
(focus)="onTouch()"
/>
<input
name="dpToDate"
#dpToDate
(input)="toDate = validateInput(toDate, dpToDate.value)"
(focus)="onTouch()"
/>


And

onDateSelection(date: NgbDate) {
if (!this.fromDate && !this.toDate) {
this.fromDate = date;
} else if (!this.fromDate || !this.toDate) {
const selectedDate = this.fromDate || this.toDate;
if (date.before(selectedDate)) {
this.fromDate = date;
this.toDate = selectedDate;
} else {
this.fromDate = selectedDate;
this.toDate = date;
}
} else {
this.toDate = null;
this.fromDate = date;
}


}

How to close popper window when both dates are selected?

I have tried like this: // Close the datepicker if both fromDate and toDate are selected

if (this.fromDate && this.toDate) {
this.datePicker.close();
}


But I get error: Property datePicker does not exist on type DateRangeInputComponent

Continue reading...