javascript - 错误 : Datepicker: value not recognized as a date object by DateAdapter

标签 javascript angular typescript datepicker angular-material2

从昨天开始,我一直在努力解决 Angular Material 2 日期选择器的问题, 最后之前npm install它工作正常,现在我得到:

ERROR Error: Datepicker: value not recognized as a date object by DateAdapter.
HolidayRequestComponent.html:21 

第 21 行是我的 <input开始

<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>

我的组件.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)
      });

      }
  }

最佳答案

根据 https://github.com/angular/material2/issues/6265

空字符串不是可接受的值,它会引发以下错误:

Datepicker: value not recognized as a date object by DateAdapter.

所以解决办法就是改变

this.dateRangeForm = new FormGroup({
        holidayDataControl: new FormControl('', Validators.required)
      });

this.dateRangeForm = new FormGroup({
        holidayDataControl: new FormControl(null, Validators.required)
      });

关于javascript - 错误 : Datepicker: value not recognized as a date object by DateAdapter,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45752758/

相关文章:

javascript - 使用 'new' 调用函数比不使用它更便宜?

java - 如何在 Java 中使用 Jsoup 从 javascript 变量解析 html?

javascript - 软件 3d 引擎中的投影数学

angular - Http.get().catch 的返回类型是什么?

angular - 在 mat-select 上重新选择相同值时触发事件

angular - 测试依赖于路由参数的组件

javascript - AngularJS + Typescript => Controller 范围

node.js - 如何为所有项目使用一个node_modules

node.js - 我不知道为什么我的 http 请求在我的 Angular 项目中不起作用?

TypeScript 0.9 - 找不到文件