How can I change timezone offset on Ionic datetime?

Does anyone knows how to ignore or to set an offset time when picking a time in ion-datetime? I tried +1:00 in the pickerFormat as stated in the docs https://ionicframework.com/docs/api/components/datetime/DateTime/ but this doest make any difference.

<ion-item>
  <ion-label>Date</ion-label>
  <ion-datetime displayFormat="YYYY/M/D  HH:mm " pickerFormat="YYYY MM D HH:mm +01:00" [(ngModel)]="myDate" min="{{minDisp}}" max="2030" placeholder="Choose Date"></ion-datetime>
</ion-item>

I would just like to have the same time I choose in the datetime picker when I convert it to a date object.
I’m always getting something like 2017-04-27T01:00:00Z and the “Z” always results in adding 2 hours when I convert this to a Date Object. which means I’d get 3:00 O’clock in this case.

x=new Date (myDate); console.log (x);
Thu Apr 27 2017 03:00:00 GMT+0200 (CEST)
2 Likes

i found this one and it help me, hope it will help you

date = new Date();
myDate: String = new Date(this.date.getTime() - 
                 this.date.getTimezoneOffset()*60000).toISOString();

Note: this Time zone is for Mexico City

6 Likes

I solved my problem with ion-datetime (Hours and Minutes):

<ion-item>
  <ion-label>Now</ion-label>
  <ion-datetime displayFormat="HH:mm" pickerFormat="HH:mm" [(ngModel)]="myDate"></ion-datetime>
</ion-item>

First step:

myDate = new Date(2018,9,6,12,0);
myDate.setMinutes(myDate.getMinutes() - myDate.getTimezoneOffset());
// myDate.getTimezoneOffset() = 120 ... GMT-3 in my case

And before save the result into database, I made the inverse:

myDate.setMinutes(myDate.getMinutes() + myDate.getTimezoneOffset());

Why it solved my problem? Because getTimezoneOffset gets the difference in minutes between the time on the local computer and Universal Coordinated Time (UTC).

3 Likes

SOLVED

Note: this Time zone get from device

2 Likes

Works perfect for me! I live in Texas lol.

1 Like

solved! thank you!!!

2 Likes

And I will say more, the right way to work with dates and times is save it on back-end always with the “timestamp UTC” format. Consider convert this to end user always that it’s called and vice versa. You will never more have problems and your app will be prepared to internationalization.