Как изменить формат выходного углового материала datepicker date? - PullRequest
0 голосов
/ 04 июня 2018

Моему бэкэнду API требуется дата в формате: дд / мм / гггг.Я изменяю формат ввода даты ввода в dd / MM / YYYY.

Пример: 05.01.1992 (ввод) дает вс 5 января 1992 00:00:00 по Гринвичу + 0100 (CET) {} в консоли

Мой customInputFormatDatepicker

import { NativeDateAdapter } from '@angular/material';

export const APP_DATE_FORMATS = {
    parse: {
        dateInput: { month: 'short', year: 'numeric', day: 'numeric' },
    },
    display: {
        dateInput: 'input',
        monthYearLabel: { year: 'numeric', month: 'numeric' },
        dateA11yLabel: { year: 'numeric', month: 'long', day: 'numeric' },
        monthYearA11yLabel: { year: 'numeric', month: 'long' },
    }
};


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: Object): string {
       if (displayFormat === 'input') {
           const day = date.getDate();
           const month = date.getMonth() + 1;
           const year = date.getFullYear();
           return this._to2digit(day) + '/' + this._to2digit(month) + '/' + year;
       } else {
           return date.toDateString();
       }
   }

   private _to2digit(n: number) {
       return ('00' + n).slice(-2);
   }
}

1 Ответ

0 голосов
/ 14 декабря 2018

похоже, что оператор else вашей функции форматирования всегда выполняется.Не уверен, что displayFormat будет === 'input', для меня это не так.то, что вы могли бы сделать в методе format, это передать свой собственный формат с помощью moment.js, например, так:

    const formatString =  '<your-format>';
     return moment(date).format(formatString);

Вы добавили провайдеров в ngModule

providers: [
    { provide: DateAdapter, useClass: DateFormat },
    { provide: MAT_DATE_FORMATS, useValue: MOMENT_DATE_FORMATS }

  ],

, это сработало дляменя для форматов даты.

const APP_DATE_FORMATS = {
 parse: {
dateInput: 'd/MM/yyyy'
  },
 display: {
   dateInput: 'dd/MM/YYYY',
monthYearLabel: 'MMMM Y',
dateA11yLabel: 'LL',
monthYearA11yLabel: 'MMMM Y'
  }
};
...