Use ion-datetime v4 instead of v6

Question

I am working on an ionic project that was primarily built using v4 of the ionic framework. After a recent change in my system setup I'm not able to display my datetime component as it was under ionic v4

I would like to display my date time as following:

Instead of what it is now:

How to force ionic to use v4 component instead of v6?

Answer 1

After looking for a good idea and keeping the version of ionic, you can use the multipicker as a date picker, I know it's not the best solution, but is the closer way to do it with the same view, here is an example of day - month picker

Put in your html:

<ion-item>
<ion-input type="">{{pdate}}</ion-input>
</ion-item>
<ion-button expand="block" (click)="presentPicker()">Show Picker</ion-button>

Put in your controller:

private pdate: string;
constructor(private pickerController: PickerController) { }
...
async presentPicker() {
const picker = await this.pickerController.create({
  buttons: [
    {
      text: 'Confirm',
      handler: (selected) => {
        this.pdate = selected.day.value +selected.month.value ;
      },
    }
  ],
  columns: [
    {
      name: 'day',
      options: [
        { text: '01', value: '01' },
        { text: '02', value: '02' },
        { text: '03', value: '03' },
      ]
    },
    {
      name: 'month',
      options: [
        { text: 'Jan', value: '01' },
        { text: 'Feb', value: '02' },
        { text: 'Mar', value: '03' },
      ]
    }
  ]
});
await picker.present();

}

Answer 2

you need to install ionic v4 follow this command

npm install -g ionic@5.0.0