How do I convert '2019-02-22T12:11:00Z' to 'DD/MM/YYYY HH:MM:SS' format in angular

Question

I am working on some API clockify API integration. I am getting all time entries from the API. in the response I am getting start & end time of the task in the 2019-02-22T12:11:00Z.

I want to convert above date format in DD/MM/YYYY HH:MM:SS format. I have used date pipe for this {{item.timeInterval.start | date: dd/MM/yyyy, h:mm a z}} but its not working. it displays the same.

How can I achieve this?

score 1 · Answer 1 · answered Feb 22 '19 at 07:46

1

Try using parse into Date object like this -

parseIntoDate(date){
    return Date.parse(date)
}

<p>{{parseIntoDate(item.timeInterval.start) | date: 'dd/MM/yyyy, h:mm a z'}}</p>

Working Example

answered Feb 22 '19 at 07:46

Pardeep Jain

84,110
37
165
215

the date format was wrong so we don't need to parse – Muhammed Albarmavi Feb 22 '19 at 08:19
1

`{{"2019-02-22T12:11:00Z"| date: 'dd/MM/yyyy, h:mm a z'}}` – Muhammed Albarmavi Feb 22 '19 at 08:21
@malbarmawi amaze what if in above statement date format is wrong? – Pardeep Jain Feb 22 '19 at 08:50
Haha Anyways loved smilies – Pardeep Jain Feb 22 '19 at 08:51
Date pipe will parse to date by default before start generate the formated date https://github.com/angular/angular/blob/7.2.6/packages/common/src/pipes/date_pipe.ts#L174 https://github.com/angular/angular/blob/7.2.6/packages/common/src/i18n/format_date.ts#L669 – Muhammed Albarmavi Feb 22 '19 at 08:58

Muhammed Albarmavi · Answer 2 · 2019-02-22T08:18:15.043

0

Your date format is wrong any wrong format will not parse as an example YYYY format will return YYYY but yyyy will return the year 2019 check the documentation for the all format option her

{{'2019-02-22T12:11:00Z' | date : "dd/MM/yyy HH:mm:ss"}}
<br>
{{'2019-02-22T12:11:00Z' | date : "short"}}
<br>
{{'2019-02-22T12:11:00Z' | date : "full"}}
<br>
{{'2019-02-22T12:11:00Z' | date : "yyy"}}

stackblitz demo

edited Feb 22 '19 at 08:18

answered Feb 22 '19 at 07:56

Muhammed Albarmavi

23,240
8
66
91

score 0 · Answer 3 · answered Feb 22 '19 at 07:57

0

Date in my TS file -

myDate = '2019-02-22T12:11:00Z';

in the html

answered Feb 22 '19 at 07:57

Vedant Karpe

71
1
5

1

MM mean month `HH:MM:SS` => `HH:mm:ss` – Muhammed Albarmavi Feb 22 '19 at 08:22

score 0 · Answer 4 · answered Feb 22 '19 at 07:58

0

You can just convert your string into a Date object when you receive the data from the API. Just use item.timeInterval.start = new Date(item.timeInterval.start)

answered Feb 22 '19 at 07:58

DrFreeze

137
10

How do I convert '2019-02-22T12:11:00Z' to 'DD/MM/YYYY HH:MM:SS' format in angular

4 Answers4