首页 > 解决方案 > 将 mat-datepicker 转换为字符串

问题描述

我正在尝试一种反应形式,其中用户使用 mat-datepicker 输入了一些日期。我面临的问题是 mat-datepicker 的输出是一个包含日期的时刻对象。我想获取字符串中的日期(例如:“YYYY-MM-DD”)而不是对象。

目前,我的表单组件的 html 模板如下所示:

<form [formGroup]="myForm">
<mat-form-field>
    <mat-label>Date d'expiration</mat-label>
    <input matInput [matDatepicker]="picker" formControlName="expireDate">
    <mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
    <mat-datepicker #picker></mat-datepicker>
</mat-form-field>

而且,我的组件看起来像这样:

import { Component, OnInit } from '@angular/core';
import { FormBuilder, FormGroup, Validators } from '@angular/forms'
declare var require: any
const moment = require('moment');
@Component({
  selector: 'app-form',
  templateUrl: './form.component.html',
  styleUrls: ['./form.component.css'],
})
export class FormComponent implements OnInit{
  myForm : FormGroup;
  constructor(private fb: FormBuilder) { }
  ngOnInit(): void {
    this.myForm =  this.fb.group({
      expireDate: [moment(),[
        Validators.required,
      ]],
    });
  }
}

提前致谢!

标签: angularstringangular-materialmat-datepicker

解决方案


您可以像以下示例一样格式化时刻日期对象:

const currentDate = moment();
moment(currentDate).format('YYYY-MM-DD');

推荐阅读