angular material date picker close event

user_1199497 0
Viewed 2878

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

angular-material angular
1 Answers

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
  }
user_71222860
Related