angular material date picker close event

Question

I am using Angular material date picker as below. when date picker is closed, I need to apply the CSS. FYI, I don't have any button to close the popup

Code:

 <input
          matInput
          #resultPickerModel="ngModel"
          [matDatepicker]="pickerEndDate"
          [(ngModel)]="endDate"
          (click)="pickerEndDate.open()"
          name="endDate"
          [min]="minStartDate"
          [max]="maxEndDateDate"
        />
        <mat-datepicker #pickerEndDate></mat-datepicker>

My expectation is that I need to apply the CSS when calendar is closed. Kindly help me to do that

Answer 1

simply you can use close event then based on your logic you can apply your css using ngStyle

<mat-datepicker #picker (closed)="onClose()"></mat-datepicker>

<div [ngStyle]="{'background-color':condition ? 'green' : 'red' }" ></div>


onClose(){
    //your condition logic
  }