Date Popup does not close when I press ESC or click outside the window.
This scenario happens only if ngbDatepicker
splits into two parts for the additional beautification.
Any help will be appreciated. Angular 7 is the version currently used.
<div class="input-group input-margin-top">
<div class="clearable">
<i class="clearable-clear mdi mdi-calendar-text" (click)="toggleDatepicker($event)" ></i>
<input class="input-style" #ngbDp name="dp" [readonly]="true" [(ngModel)]="start_date" ngbDatepicker
(ngModelChange)="onStartDateChange($event)">
</div>
</div>
<div #calendarStart class="date-picker popup">
<div class="close-button-row">
<button class="ml-auto" (click)="toggleDatepicker($event)">
<i class="mdi mdi-close"></i>
</button>
</div>
<div class="flex-row-center">Start Date</div>
<ngb-datepicker #dp [(ngModel)]="start_date" (navigate)="date = $event.next" name="ngbDp"
[minDate]="minDate" [maxDate]="maxDate" (ngModelChange)="onStartDateChange($event)">
</ngb-datepicker>
</div>