TypeScript (Angular) Datetime To Date

Question

Я получил это сообщение об ошибке

Указанное значение «2019-04-13T00: 00: 00» не соответствует требуемый формат "гггг-ММ-дд".

Я хочу изменить дату / время на дату.

пример даты и времени: 2019-04-13T00: 00: 00

Я хочу сделать пример: 2019-04-13

HTML

 <input
  class="form-control mr-sm-2"
  id="dates"
  name="achievement_date"
  [(ngModel)]="addItems.achievement_date"
  required
  type="date"
  placeholder="Tournament Date"
/>

Answer 1

Первое предоставленное решение великолепно, поскольку оно решает ваше решение с помощью Vanilla JavaScript!

Однако у меня есть два других альтернативных решения.

1) Используется встроенная в Angular DatePipe . Вы даже можете передавать различные форматы DateTime.

import { DatePipe } from '@angular/common';
.
.
export class SampleComponent implements OnInit {   

  constructor(private datePipe: DatePipe) {
    this.addItems.achievement_date = datePipe.transform('2019-04-13T00:00:00', 'yyyy-MM-dd');
    // console.log(this.date)
  }

}

Не забудьте импортировать DatePipe вашим поставщикам в модуле, который его использует.

import { DatePipe } from '@angular/common';
.
.
@NgModule({
  .
  .,
  providers: [
    DatePipe
  ]
})

Выше должны отображаться даты в поле ввода. Я сделал демо , используя вышеуказанное решение

2) formatDate . Обратите внимание, что это может не работать на более ранних версиях Angular. До сих пор я пробовал и тестировал его только на Angular 7.

import {formatDate } from '@angular/common';
.
.
export class AppComponent  {

  date = undefined;

  constructor() {
   this.date = formatDate('2019-04-13T00:00:00', 'yyyy-MM-dd', 'en-US');
  }

}

вот еще одна демоверсия для вас.

Answer 2

эта служебная функция моя помощь

export const getDate = function (date: any): Date {
  const _date = new Date(date);
  return new Date(
    Date.UTC(_date.getFullYear(), _date.getMonth(), _date.getDate())
  );
};

или другой способ вернуть строковое значение в формате 'гггг-мм-дд'

export const getDate = function (date: any): string{
  const _date = new Date(date);
  return `${_date.getFullYear()}-${_date.getMonth()}-${_date.getDate()}`;      
};

перед сохранением даты просто очистите значение

this.addItems.achievement_date = getDate(this.addItems.achievement_date);