InvalidPipeArgument: «Невозможно преобразовать« 2018-01-01-12: 12: 12: 123456 »в дату» для канала «DatePipe»

Question

 <td>{{suite.testSuiteAttributes && 
       suite.testSuiteAttributes.modifiedTimestamp | date: 'yyyy-MM-dd'
     }}
</td>

Я хочу формат даты в формате CST "05-Feb-2018 11:00:00 PM CST". Но получаю ошибку:

Невозможно преобразовать "2018-01-01-12: 12: 12: 123456 "в дату" для канала "DatePipe

Я думаю, это связано с тем, что timeStamp не в формате даты ... но получают только эту дату избэкенд.Пожалуйста, предложите.

Answer 1

Ваша дата "2018-01-01-12: 12: 12: 123456" недействительна Дата ISO 8601 , поэтому она не может быть проанализирована встроенным анализатором.Либо используйте правильный формат даты, либо напишите собственный анализатор.

Вы можете использовать регулярное выражение или просто использовать строковые функции, такие как подстрока, как продемонстрировано в другом ответе.

Даты в Javascript будут влокальный часовой пояс браузера, который является системным временем пользователя, нет собственного способа создания даты в другом часовом поясе.Вы можете создать дату в UTC и использовать toLocaleString(), чтобы преобразовать ее в определенный часовой пояс.Зависит от того, дата отправлена ​​с бэкэнда в UTC или CT.Если это CT, то это будет работать только для пользователей в часовом поясе CT.

let result = "2018-01-01-12:12:12:123456".match(/(\d{4})-(\d{2})-(\d{2})-(\d{2}):(\d{2}):(\d{2}):(\d{3})/).map(x => parseInt(x, 10));

result.shift();

console.log(new Date(...result).toLocaleString())

Answer 2

Я думаю, что вы получаете неправильный формат даты с сервера. Вам нужна дата в правильном формате, чтобы конвертировать ее

Итак, вот обходное решение вашей проблемы, в котором я написал myDateParser() метод для преобразования вашей недопустимой даты в действительную дату.

your.component.ts

import { Component } from '@angular/core';

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
})
export class AppComponent  {
  name = 'Angular';
  modifiedTimestamp;

 constructor(){

   // Passing unformatter date
   this.modifiedTimestamp = this.myDateParser('2018-01-01-12:12:12:123456');
 }

 /**
  * Custom Date parser

  */
  myDateParser(dateStr : string) : string {
    // 2018-01-01T12:12:12.123456; - converting valid date format like this

    let date = dateStr.substring(0, 10);
    let time = dateStr.substring(11, 19);
    let millisecond = dateStr.substring(20)

    let validDate = date + 'T' + time + '.' + millisecond;
    console.log(validDate)
    return validDate
  }
}

your.component.html

  <table>
    <tr>
     <td>{{modifiedTimestamp |  date: 'yyyy-MM-dd'}}</td>
    </tr>
   </table>

Решение на стеке

Надеюсь, это поможет!