angular - 如何使用patchValue以 Angular react 形式设置日期

Question

我正在尝试设置带有时间的datepicker控件的值。无法完成

尝试转换为所需格式

app.component.html

<input id="requestdate" type="date" class="form-control" formControlName="requestdate" 

app.component.ts

ngOnInit() {

this.loginForm = this.formBuilder.group({ 
                    requestdate : ['']
                  })

let date = new Date()
date = date.toLocaleDateString().substring(0,10)

this.loginForm.get('requestdate').patchValue(date)


}

无法看到转换日期

Answer 1

重新分配date变量时，您似乎使用了错误的语法。由于已将其初始化为Date，因此它将不接受您提供的格式的字符串。您将必须使用YYYY-MM-DD格式。

试试这个:

import { Component } from '@angular/core';
import { FormBuilder, FormGroup } from '@angular/forms';

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  loginForm: FormGroup;

  constructor(
    private formBuilder: FormBuilder
  ) { }

  ngOnInit() {
    this.loginForm = this.formBuilder.group({
      requestdate: ['']
    })
    this.loginForm.get('requestdate').patchValue(this.formatDate(new Date()));
  }

  private formatDate(date) {
    const d = new Date(date);
    let month = '' + (d.getMonth() + 1);
    let day = '' + d.getDate();
    const year = d.getFullYear();
    if (month.length < 2) month = '0' + month;
    if (day.length < 2) day = '0' + day;
    return [year, month, day].join('-');
  }
}

不要忘了将 input字段包裹在 form标签周围，并将 formGroup属性设置为 loginForm:

<form [formGroup]="loginForm">
  <input
    id="requestdate" 
    type="date" 
    class="form-control" 
    formControlName="requestdate" />
</form>

Here's a Working Sample StackBlitz for your ref.