Angular 2 Date deserialization

Question

I have an Angular 2 application. A service is requests data from an api that returns the results like the following:

{
    \"data\":[
        {\"id\":1,\"ti         


        

Answer 1

The date pipe only accepts Date values not string values.

See How to get Date object from json Response in typescript for how to convert dates in JSON.

Alternatively you can create your own string-to-date conversion pipe

@Pipe({name: 'toDate'})
export class StringToDate implements PipeTransform {
  transform(value, [exponent]) : number {
    if(value) {
      return new Date(value);
    }
  }
}

and then use it like

{{item.timestamp |toDate | date:'short'}}

Hint: don't forget to add the pipe to pipes: [StringToDate] on the @Component(...) decorater where you want to use it.

See also

• https://github.com/angular/angular/pull/8038
• https://github.com/angular/angular/pull/7794