Components: Bug: Datepicker value change event fires when changing min value of it

[gogakoreli]

Bug, feature request, or proposal:

Bug

What is the expected behavior?

I am not sure it is expected to behave like that or not, but I think that changing min value of datepicker shouldn't fire value changes event of the form group. I changed value of min date inside subscribe method because I want to have mindate dynamically updated. I checked two conditions one with the formgroup where it happens twice all the time and another condition using just formcontrol this issue happens only first time.
If I comment out the update of the mindate inside subscribe everything will be okay

What is the current behavior?

Form Group value change happens when changing Datepicker min value via two way binding, Min value update happens inside Subscribe method. This issue causes to fire valuechanges twice

What are the steps to reproduce?

Reproduction is StackBlitz using the formgroup
https://stackblitz.com/edit/datepicker-min-date-bug?file=app/datepicker-min-max-example.ts

What is the use-case or motivation for changing an existing behavior?

I think something is odd because different conditions behave differently ( for example as I stated above about formcontrol vs formgroup)

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

Angular Material 5.0.0-rc3

[Msimoneau]

@gogakoreli ,

I had the same problem and I used a simple workaround, a filter to simulate the min. This way, valuechanges isn't fired twice.

I added the filter to the input matDatepickerFilter.

<input [matDatepickerFilter]="minFilter"...

minFilter = (d: Date): boolean => {
  const from = new Date(this.form.get('curDate').value);
  if ( d < from ) {
    return false;
  }
  return true;
}

Here's your modified example:
https://stackblitz.com/edit/datepicker-min-date-bug-53war2

[gogakoreli]

Thank you that solves it 😄 It is interesting why [min] binding behaves differently

[mmalerba]

something to note though: doing it with a filter this way is less efficient, especially for year and multiyear view and it allows the user to navigate arbitrarily far past the min and max (just everything will show as grayed out) min/max actually prevent navigating beyond that page

[Springrbua]

I faced a similar issue, where changes of min, max or matDatepickerFilter tiggered a valueChange.
I tried to track down the issue and it seems like the problem is the interaction between the datepicker and the formcontrol:
The MatDatepickerInput is a Validator and calls the validatorOnChange-callback, whenever min, max or matDatepickerFilter changes.
In setUpControl in angular/forms, the validatorOnChange-callback is set and it calls updateValueAndValidity, which causes the value change event.

[masoudtahmasebi93]

Any news on this? Is this issue fixed ?

[Ajiharan]

the issue was new Date() will be changed when min and max call every time so don't add new Date() directly
minfilter(){
return new Date()//don't do like this
}

//do like this
currentDate=new Date();
minfilter(){
return this.currentDate;
}