Я использую ангуляр материал дейтпикер в своей приложении. Для форматирования даты у меня есть необходимость переписать функционал NativeDateAdapter. Вывод в поле должен быть MM/DD/YYYY. В датапикере есть маска и возможность ручного ввода. Все работает хорошо, но если отредактировать дату к примеру: 11/05/1111 (5 ноября 1111 года) в середине, то есть вместо 5го числа сделать 6го число, то дата отобразится так: 11/06/0111. Хотелось бы чтобы в данной случае дата была 11/06/1111. Стоит отметить, что при последующем редактировании - все хорошо (если уже отредактировать дату 11/06/0111).
export class AppDateAdapter extends NativeDateAdapter {
public format(date: Date, displayFormat: Object): string {
if (displayFormat === 'input') {
let d = _moment(date).format('MM/DD/YYYY');
return formatDate(d, 'MM/dd/yyyy', 'en-US');
// const year: number = date.getFullYear();
// const month: string = `${date.getMonth() + 1}`.padStart(2, '0');
// const day: string = `${date.getDate()}`.padStart(2, '0');
// return `${month}/${day}/${year}`;
}
return date.toDateString();
}
public parse(value: any): Date | null {
const date: Moment = _moment(value, 'MM/DD/YYYY');
return date.isValid() ? date.toDate() : null;
}
}
export const PICK_FORMATS = {
parse: {
dateInput: 'MM/DD/YYYY',
},
display: {
dateInput: 'input',
monthYearLabel: 'MMMM YYYY',
dateA11yLabel: 'LL',
monthYearA11yLabel: 'MMMM YYYY',
},
};
providers: [
{
provide: DateAdapter, useClass: AppDateAdapter,
},
{
provide: MAT_DATE_FORMATS, useValue: PICK_FORMATS,
},
]
mask directive:
private maskedInputController: any;
constructor(private element: ElementRef) {
this.maskedInputController = textMask.maskInput({
inputElement: this.element.nativeElement,
mask: [
new RegExp('\\d'),
new RegExp('\\d'),
'/',
new RegExp('\\d'),
new RegExp('\\d'),
'/',
new RegExp('\\d'),
new RegExp('\\d'),
new RegExp('\\d'),
new RegExp('\\d'),
],
showMask: true,
guide: false,
});
}