Reputation: 287
From yesterday i'm struggling with a problem with angular material 2 datepicker,
before last npm install
it was working properly and now i get:
ERROR Error: Datepicker: value not recognized as a date object by DateAdapter.
HolidayRequestComponent.html:21
21st line is where my <input
starts
<md-input-container [formGroup]="dateRangeForm">
<input
mdInput
name="date_from"
[mdDatepicker]="from"
placeholder="Start date"
formControlName="holidayDataControl"
[ngModel]="date_from"
>
<md-datepicker-toggle mdSuffix [for]="from"></md-datepicker-toggle>
</md-input-container>
<md-datepicker #from></md-datepicker>
My component.ts:
import {Component, OnInit, Inject } from '@angular/core';
import {MD_DIALOG_DATA, MdDialog } from '@angular/material';
import {FormBuilder, FormControl, FormGroup, NgForm, Validators} from '@angular/forms';
import {Observable} from 'rxjs/Observable';
@Component({
selector: 'app-holiday-request',
templateUrl: './holiday-request.component.html',
styleUrls: ['./holiday-request.component.css']
})
export class HolidayRequestComponent implements OnInit {
public date_from = new Date();
constructor(@Inject(MD_DIALOG_DATA) public data: any,
private fb: FormBuilder,
) {
this.dateRangeForm = new FormGroup({
holidayDataControl: new FormControl('', Validators.required)
});
}
}
Upvotes: 3
Views: 2425
Reputation: 287
According to https://github.com/angular/material2/issues/6265
an empty string is not an acceptable value and it is raising the following error:
Datepicker: value not recognized as a date object by DateAdapter.
so the solutions is to change
this.dateRangeForm = new FormGroup({
holidayDataControl: new FormControl('', Validators.required)
});
to
this.dateRangeForm = new FormGroup({
holidayDataControl: new FormControl(null, Validators.required)
});
Upvotes: 7