3

Iam using mattlewis angular-calendar for showing events but it is not showing correct time in view. time is fetched correctly from the api but in the view it is adding 5:30 hours. eg if meeting starts at 11:00 AM , it is showing 4:30Pm in the week view. I am in the GMT+530 timezone

Jyotsana
  • 31
  • 1

2 Answers2

1

From my understanding to your problem you need to make sure that the date of your API is timezoned or it's in milliseconds, that way your Front End application will get the correct date with the correct timezone.

qannouf oualid
  • 98
  • 3
  • 8
  • My API is fetching correct details coz if I'm viewing the meeting details in other form or console it is showing correct timing. Only the calendar view is showing wrong timing – Jyotsana Sep 28 '19 at 16:29
0

I know this is an old thread, but for Clarity I want to show how I resolved this on my system.

The DateTime value you send to the server for storing needs to be converted to UTC time, in my case this was with Entity Framework and Dotnet Core 5.0 so I converted it to UTC when storing as follows

createdEvent.StartDate = newEvent.StartDate.ToUniversalTime();
createdEvent.EndDate = newEvent.EndDate.ToUniversalTime();

I then check the database and the datetime will have changed by the timezone from the frontend's values to the UTC time.

So for example the Date time selected on the front end was

"startDate": "2021-03-10T08:00:00"
"endDate": "2021-03-10T10:00:00"

When this gets stored in the database the code above will change the values to UTC based on the Timezone of the system, for me this is Africa/Johannesburg which is GMT+02:00 so the values stored in the database is now this

"2021-03-10 06:00:00.000000"

Now when the value gets returned to the frontend - Angular Calendar in my case and the Ops case then it will be returned as UTC time marked.

This is done in C# dotnet core 5.0 by following the code from ChristopherHaws comment in the link.

This will send the value to the frontend as follows

"startDate": "2021-03-10T06:00:00Z",
"endDate": "2021-03-10T08:00:00Z"

Which will display correctly in the Calendar. enter image description here

Ronald
  • 25
  • 5