Date Picker event is not firing up onChange()-CodePudding

Im using Angular Material DatePicker.Everything works fine,but(change) event is not firing up when i change date using calender. Manualy input of date is working,i want to through error message when the user selects an invalid date range through calender popup(Manually entered invalid date validations are working fine)

<input type="hidden" [matDatepicker]="picker" [min]="minDate" [max]="maxDate" [(ngModel)]='value'>
    <input  matInput  #inputId name="{{id}}"   [ngModel]="value | date:'MM/dd/yyyy'"
       [formControl]="formControl" [formlyAttributes]="field"
      (change)="onChange($event)" (focusout)="onFocusOut($event)" />
    
      <mat-datepicker-toggle [for]="picker">
        <mat-icon  matDatepickerToggleIcon svgIcon="datepickertoggle" ></mat-icon>
      </mat-datepicker-toggle>
    
    <mat-datepicker disabled="{{to.disabled}}" (selectedChanged)="onChangeDate($event)" #picker></mat-datepicker>
  </div>
<mat-error id={{id}}>
    <formly-validation-message [field]="field"></formly-validation-message>
  </mat-error>

CodePudding user response：

It sounds as if the change event isn't triggered by your code. If the user does not explicitly set a value, the change event is not triggered.

Read into the following question to learn more: How to trigger a change event manually - angular2

CodePudding user response：

You should be using the dateChange event and dateInput(in case user changes input manually from textbox)

(dateChange)="onChange($event)" (dateInput)="onChange($event)"

instead of just using.

(change)="onChange($event)"