Datetime display errors in iOS 8.x

[mhartington]

Short description of the problem:

Datetime columns are displayed incorrectly running iOS 8x

Steps to reproduce:

1. ionic start tmp blank --v2 && cd tmp
2. add the following markup to home.html

  <ion-list>
    <ion-item>
      <ion-label>Date</ion-label>
      <ion-datetime displayFormat="MM/DD/YYYY" [(ngModel)]="myDate"></ion-datetime>
    </ion-item>
  </ion-list>

1. Build and deploy to iOS8 device or simulator

Other information: (e.g. stacktraces, related issues, suggestions how to fix, stackoverflow links, forum links, etc)
https://forum.ionicframework.com/t/ionic-2-datetime-component-issue-on-ion-8-3-1/56814/4

Which Ionic Version? 1.x or 2.x
2.x, nightly

Plunker that shows an example of your issue

Device only issue. Use commands provided above.

[mhartington]

Looking into it, seems that inline styles are not getting applied.

In iOS9/10 renders out the correct styles.

<button category="picker-opt" type="button" class="disable-hover picker-opt picker-opt-default picker-opt-selected" ng-reflect-category="picker-opt" style="transform: rotateX(0deg) translate3d(0px, 0px, 90px);"><span class="button-inner">

Where ios8 only renders

<button category="picker-opt" type="button" class="disable-hover picker-opt picker-opt-default" ng-reflect-category="picker-opt"><span class="button-inner">

Possibly due to this line

[mkuffo]

I am having the same issue. Please, let me know if there is any work around for now.

[chris-hammons]

Is there a possible work around for this? Our app has the same issue and we need to support ios 8.x and above.

[lennykean]

It looks like ios8 needs the -webkit- css properties for transform and transform duration. I created a pull request where I added these