0

我想从 JSON 输出 mat-datepicker 的输入字段中的日期。当我运行输出时，我总是得到当前年份。我正在使用 ReactiveForms。我究竟做错了什么？

我的代码：

// JSON

{
    "success": true,
    "mandant": {
        "mandantId": 2,
        "firm": "Test GmbH",
        "street": "Test-Street",
        "number": "2",
        "zip": "5xxxx",
        "city": "Exxxxxxxx",
        "country": "Germany",
        "financial_year_start": "Jan. 1, 2020" // This is to be output in the input
    }
}

// TS

public getFiscalYearStart: string;

  ngOnInit() {
    // To initialize forms
    this.initForm();

    // To initialize loadFinancialYearStart
    this.loadFinancialYearStart();
  }

// Creation of the settingsContentForm
  private initForm() {
    // General
    this.settingsContentForm = this.formBuilder.group({
      financial_year_start: new FormControl(moment(this.getFiscalYearStart), Validators.required),
    });
  }

  /**
   * Fill the datePicker with data
   */
  loadFinancialYearStart() {
    this.userAreaService.getCurrentMandantData().subscribe(resp => {
      this.getFiscalYearStart = resp.mandant.financial_year_start;
      console.log(this.getFiscalYearStart); // Correct year is displayed in the console
    });
  }
4

2 回答 2

0

分两步完成）使用日期解析函数1将字符串解析为a ，）然后将其设置为您的日期选择器Date Object2

要将字符串解析为日期格式，请使用Date.parse() MDN中的帮助程序以及您的 JSON 字符串将发送的日期格式示例。

可以肯定的是，我会检查它是否在值中，或者在对象中

//Step 1  financial_year_start.value

const unixTimeZero = Date.parse(financial_year_start.value);
// is it in the value Object
const financial_year_startDateValueAttribute = Date.parse(financial_year_start.value);
const financial_year_startDate = Date.parse(financial_year_start);

console.log(unixTimeZero);
// expected output: 0

console.log(financial_year_startDate );

// look if its in the value
console.log(financial_year_startDateValueAttribute );

// Now you have a date object you can set to Mat date picker

您也可以使用日期构造函数来执行此操作，但首先使用 Date 构造函数将该字符串日期转换为 Date 对象：

  var date = new Date(financial_year_start.value);
于 2021-05-29T18:08:07.247 回答
0

这可能与日期格式问题和DatePicker显示当前日期有关，因为它无法处理日期字符串。

试一试并在 JSON 中进行以下更改

"financial_year_start": new Date("2020/01/01").toDateString()
于 2021-05-29T16:57:59.947 回答