如何在角度6的材料日期选择器中编辑日期格式?

Question

我正在为我的 angular 6 项目使用材料日期选择器。默认情况下，我来自材料日期选择器的日期格式是 dd-mm-yyyy。但我需要 yyyy-mm-dd..我该怎么做。这是我的代码

<mat-form-field style="margin-right: 25px;">
<input matInput [matDatepicker]="picker_start" placeholder="2018-08-31" [(ngModel)]="startdate" >
<mat-datepicker-toggle matSuffix [for]="picker_start"></mat-datepicker-toggle>
<mat-datepicker #picker_start></mat-datepicker>
</mat-form-field>

Answer 1

你可以写一个简单的dateAdapter：

import { NativeDateAdapter, DateAdapter, MAT_DATE_FORMATS, MatDateFormats } from "@angular/material";

export class AppDateAdapter extends NativeDateAdapter {
parse(value: any): Date | null {
if ((typeof value === 'string') && (value.indexOf('/') > -1)) {
const str = value.split('/');
const year = Number(str[2]);
const month = Number(str[1]) - 1;
const date = Number(str[0]);
return new Date(year, month, date);
}
const timestamp = typeof value === 'number' ? value : Date.parse(value);
return isNaN(timestamp) ? null : new Date(timestamp);
}
format(date: Date, displayFormat: string): string {
if (displayFormat == "input") {
let day = date.getDate();
let month = date.getMonth() + 1;
let year = date.getFullYear();
return   year + '-' + this._to2digit(month) + '-' + this._to2digit(day)   ;
} else if (displayFormat == "inputMonth") {
let month = date.getMonth() + 1;
let year = date.getFullYear();
return  year + '-' + this._to2digit(month);
} else {
return date.toDateString();
}
}
private _to2digit(n: number) {
return ('00' + n).slice(-2);
} 
}
export const APP_DATE_FORMATS =
{
parse: {
dateInput: {month: 'short', year: 'numeric', day: 'numeric'}
},
display: {
dateInput: 'input',
monthYearLabel: 'inputMonth',
dateA11yLabel: {year: 'numeric', month: 'long', day: 'numeric'},
monthYearA11yLabel: {year: 'numeric', month: 'long'},
}
}

演示

Answer 2

您可以使用moment.js来更改日期格式。

var moment = require('moment');
var newDate=moment(date).format('YYYY-MM-DD');