How can i apply offset to UTC time based on the browser time zone .?

Question

I am having an angular 5 project. I am having UTC date and I am trying to print it in the local browser timezone. I am using momentjs libraries. However I find that my code is not applying the offset to the UTC timezone. Really appreciate if you can help. My project is available in stackblitz

https://angular-wtj1rj.stackblitz.io/

https://stackblitz.com/edit/angular-wtj1rj?embed=1&file=src/app/app.component.html

In the app.component.ts this is the conversion function i am using

 print( item:HistogramDistribution ) {
    return " UTC time: " + item.dateRange + " Local time: " + moment.utc(item.dateRange).format("YYYY-MM-DDTHH:mm:ss");
  }

However this prints

UTC time: 2020-07-01T13:00:00.000+0000 Local time: 2020-07-01T13:00:00

I would expect the result as follows because I am one hour ahead of the UTC timezone. my timezone is Irish ( GMT+1 )..

UTC time: 2020-07-01T13:00:00.000+0000 Local time: 2020-07-01T14:00:00

really appreciate if you can help thank you

Answer 1

When you use moment.utc(...) the resulting moment is flagged as UTC - subsequent method calls on it (e.g. format) will treat it as UTC and format it accordingly.

If you want it in local time you can call local() on it. It still represents the same moment in time, but subsequent calls to format etc. will then treat it as local time.

In your example, this will give you the output you want:

moment.utc(item.dateRange).local().format("YYYY-MM-DDTHH:mm:ss")

Updated example

Docs at https://momentjs.com/docs/#/manipulating/local/