Недопустимый аргумент "формат даты" для канала "DatePipe"?

Кажется, это простой вопрос. Я использую трубы в своем приложении Ionic 2 для формата дат. Это полученный ответ веб-службы.

 [
  {
    "MessageID": 544882,
    "CategoryID": 1,
    "DateSent": "2015-05-18T02:30:56",
    "Title": "Jobseeker App",
    "MessageContent": "Hi Test guy just started to use the app..",
    "Sender": null,
    "Recipient": null,
    "DateReceived": null,
    "DateRead": "2015-05-18T02:30:56",
    "Note_Direction": "sent",
    "Viewed": 0,
    "AppointmentDateTime": null,
    "MessageAttachments": [

    ]
  },
  {
    "MessageID": 544886,
    "CategoryID": 1,
    "DateSent": "2015-05-18T02:42:45",
    "Title": "Jobseeker App",
    "MessageContent": "App",
    "Sender": null,
    "Recipient": null,
    "DateReceived": null,
    "DateRead": "2015-05-18T02:42:45",
    "Note_Direction": "sent",
    "Viewed": 0,
    "AppointmentDateTime": null,
    "MessageAttachments": [

    ]}
   ]

Это фрагмент кода, который я использую.

<div class="Date">
<label class="time">{{appointment.DateSent | date:"HH"}}:{{appointment.DateSent| date:"mm"}}</label>
<label class="month">{{appointment.DateSent| date:"MMM"}}</label>
<label class="day">{{appointment.DateSent| date:"dd"}}</label>
<label class="year">{{appointment.DateSent| date:"yyyy"}}</label>
</div>

Ошибка:

Invalid argument '2015-05-18T02:30:56' for pipe 'DatePipe' in [{{appointment.DateSent | date:"HH"}}:{{appointment.DateSent| date:"mm"}} in AppointmentsPage@14:37]

Мне нужно получить такой формат даты:

06:05
Dec
24
2015

person happycoder    schedule 26.02.2016    source источник


Ответы (1)


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

birthday = 2015-05-18T02:30:56 //Working
birthday2 = new Date(2015-05-18T02:30:56) //Working

Oldbirthday = '2015-05-18T02:30:56'  //Not Working

Здесь я использую переменную birthday вместо вашего имени переменной. Возможно, причина ошибки в том, что angular может не принимать формат даты в виде строки. по мне. Но как чиновники

  • этот канал помечен как чистый, поэтому он не будет повторно оцениваться при изменении входных данных. Вместо этого пользователи должны рассматривать дату как неизменяемый объект и изменять ссылку, когда каналу необходимо повторно запустить (это необходимо, чтобы избежать переформатирования даты при каждом запуске обнаружения изменений, что было бы дорогостоящей операцией). https://angular.io/docs/ts/latest/api/common/DatePipe-class.html

рабочий plnkr http://plnkr.co/edit/b9Z090rQpozMoMi0BWaY?p=preview

Обновить :

По мере необходимости @Kanishka да, вы можете обновить свою дату и преобразовать в new date() со стороны HTML, вы должны вызвать функцию установки и получения текста машинописного текста для того же. вот пример того, что вы ищете. поэтому, используя это, я не думаю, что вам нужно создавать свой собственный массив из ответа. Я надеюсь, что это поможет вам, и я предлагаю вам один новый метод поиграть с ответом от внешнего интерфейса.

<label>{{setDate('2015-05-18T02:30:56') | date:"yyyy"}}</label>

  get Anotherdate(){  //getter function
    return this.date
  }
  setDate(date) {
    this.Anotherdate = date;
    return this.Anotherdate;
  }
  set Anotherdate(date){     // Setter Function
    this.abc = new Date(date)
  }

вот обновленная рабочая демонстрация http://plnkr.co/edit/rHCjevNcol12vwW6B38u?p=preview

person Pardeep Jain    schedule 26.02.2016
comment
Спасибо, Pardeep, но в качестве вывода я получаю 05:30 01 января 1970 для 2015-05-18T02: 30: 56. Как скрыть "2015-05-18T02: 30: 56" на 2015-05-18T02: 30: 56? - person happycoder; 26.02.2016
comment
вам нужно преобразовать его с помощью метода new Date () и передать требуемую дату в качестве параметра. посмотрите на мой plnkr, я обновил код, как вы говорите. - person Pardeep Jain; 26.02.2016
comment
newDate = new Date('2015-05-18T02:30:56'); нравится это. - person Pardeep Jain; 26.02.2016
comment
Я новичок в Angular 2, проблема в том, что я передаю данные из класса, как я конвертирую их в директивы html? Пример: ‹ion-card * ngFor = # назначение встреч (щелчок) = itemTapped ($ event, assign)›. Как скрыть встречу.DateSent to newDate? - person happycoder; 26.02.2016
comment
можно ли объявить new date() во время записи данных класса? если так, то просто сделай это. в противном случае я думаю, вам нужно отправить дату отдельно от класса, изменив тип даты с помощью new Date(). - person Pardeep Jain; 26.02.2016
comment
Не могу ли я объявить метод в классе и вернуть преобразованный объект даты в html? - person happycoder; 26.02.2016
comment
Спасибо Pardeep за помощь. Мне пришлось преобразовать ответ json, чтобы получить необходимый результат. Я создал свой собственный массив из ответа, преобразовав объект даты с новой датой (date). У меня не было времени на изучение более простых вариантов. - person happycoder; 28.02.2016
comment
Спасибо, этот метод set-get отлично работает для приложения Angular 6 в Chrome и Firefox (85.0.2 (64-разрядная версия)) - person Pinaki; 11.02.2021