垫子日期选择器选择的日期不匹配

Question

从日期选择器中选择的日期及其反应形式的值不匹配。

li

在模板中，

ngOnInit() {
    this.findForm = this._fb.group({
      date: ['', Validators.required]
    });
}

我在code上进行了全力以赴的工作

选择一个日期，您会看到所选日期及其反应形式中的值不相同。

Answer 1

如评论中所述，MatDatePicker中的日期采用UTC格式。但是您可以使用以下方法将其转换为本地格式：

formatDate() {
  var date = new Date(`${this.findForm.value.date} UTC`);
  return date.toString();
}

在模板中：

<mat-form-field [formGroup]="findForm">
  <input matInput formControlName="date" [matDatepicker]="picker" placeholder="Choose a date">
  <mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
  <mat-datepicker #picker></mat-datepicker>
</mat-form-field>

<pre>{{ formatDate() }}</pre>

这是您推荐的Sample StackBlitz。