Search code examples
angulardate-pipe

Angular date pipe takes into account timezone

I'm using a date pipe to display a time that I obtain from a webservice API. The date comes in the form yyyy-MM-ddThh:mm:ss.000Z an example of which would be 2020-08-12T07:06:07.000Z.

However when I use the angular date pipe {{ arr.time | date:'mediumTime' }}, the time displayed is three hours more than the given time, here for example, the time displayed is 10:06:07. I suspect this is because the browser takes into account my timezone, GMT+3. How do I display the exact time, without taking the timezone into consideration?

Solution

  • There can be two conditions:

    1. The date value which you are getting is UTC
    2. Other than UTC

    The last char of that must contain 'Z' if it is UTC. So for non UTC we can add 'Z' before passing it to pipe

    This will always print whatever value for date is received

    {{arr.time?.charAt(arr.time?.length - 1) === 'Z' ? (arr.time | date:'mediumTime':'UTC') : (arr.time?.concat('Z') | date:'mediumTime':'UTC')}}