Ionic-framework: ion-datetime default value is not local

[kyleabens]

Bug Report

Ionic version:


[x] 4.0.2

Current behavior:
ion-datetime currently defaults to todays date if none is selected but does not give an option to apply an offset. Because of this, the time is not local.

Expected behavior:

ion-datetime default value should be local.

Ionic info:

Ionic:

   ionic (Ionic CLI)             : 4.10.3 (/usr/local/lib/node_modules/ionic)
   Ionic Framework               : @ionic/angular 4.0.2
   @angular-devkit/build-angular : 0.12.4
   @angular-devkit/schematics    : 7.3.1
   @angular/cli                  : 7.3.1
   @ionic/angular-toolkit        : 1.3.0

Cordova:

   cordova (Cordova CLI) : 8.1.2 ([email protected])
   Cordova Platforms     : android 7.1.4, ios 4.5.5
   Cordova Plugins       : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 2.2.5, (and 14 other plugins)

System:

   ios-deploy : 2.0.0
   NodeJS     : v10.15.0 (/usr/local/bin/node)
   npm        : 6.4.1
   OS         : macOS Mojave
   Xcode      : Xcode 10.1 Build version 10B61

[bkarv]

Beat me to it, yes same issue the default time is not local it seems like it is defaulting to the GMT time.

[liamdebeasi]

Hi there,

Thanks for opening an issue with us! Would you be able to provide an example of what you are seeing versus what you are expecting? Thanks!

[ingljo]

We are experiencing the same issue.
Steps to reproduce:

Create ion-datetime. Set format to MMM DD, YYYY HH:mm.
Set client timezone to for example GMT+2.
When selecting date at 10:00 in local time, the picker hours for the default datetime is 08:00.
Expected hours for default value should be 10:00 (local time).

[liamdebeasi]

Hey there!

I am working on a PR (#17706) that should fix this issue. If someone wouldn't mind testing this out on their end as well, that would be great. Thanks!

[liamdebeasi]

Hi there,

This fix will be in the next release of Ionic. I have published a nightly build of Ionic with this fix (npm install @ionic/core@dev). Feel free to test it out and provide feedback if you have the time.

Thanks!

[kiichi]

Hello,

I tied the dev version

npm install @ionic/core@dev

My current package.json is

"@ionic/core": "^4.1.2-dev.201903111954.bab56e8",

It is trying to show the default date but in UTC time. e.g. our time is 8:18 am in EST but the default time of the picker is 12:18 (+4 hrs).

[liamdebeasi]

Hi @kiichi,

Can you send the template that you are using? I am EST and my picker is showing 8:38am (currently 8:38am EST for me) with the following template:

<ion-item>
  <ion-label>h:mm a</ion-label>
  <ion-datetime display-format="h:mm a"></ion-datetime>
</ion-item>

[kiichi]

@liamdebeasi something like this below, using ngModel. The initial value is null.

<ion-datetime 
                  picker-format="MM/DD/YYYY HH:mm"
                  display-format="HH:mm" 
                  placeholder="-Select-" 
                  [(ngModel)]="item.StartTime"
                  (ionChange)="updateTime(item)">
</ion-datetime>

[kiichi]

Here is tested result from the snippet above. dt is assigned new Date() for reference.

  <ion-item>
    <ion-label>{{dt}}</ion-label>
    <ion-datetime display-format="h:mm a"></ion-datetime>
  </ion-item>

Current core version which I'm using is

"@ionic/core": "^4.1.2-dev.201903131547.be0258c"

Thanks!

[liamdebeasi]

Hi there,

Thanks for the follow up! Do you also have the latest nightly install of @ionic/angular? (npm i @ionic/angular@dev). If not, can you install it and try your test again?

Thanks!

[kiichi]

@liamdebeasi updating the dev for @ionic/angular helped.

Here is my steps:

npm i @ionic/angular@dev
+ @ionic/[email protected]
npm install @ionic/core@dev
+ @ionic/[email protected]

It showed the correct current time with the above sample code. Thank you!

[liamdebeasi]

Hi there,

This has been fixed by https://github.com/ionic-team/ionic/pull/17706. I am going to close this issue, but feel free to open a new issue if any other issues pop up.

Thanks!

[ionitron-bot[bot]]

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.