使用Ionic DateTime以2个步骤选择日期和时间

问题描述 投票:3回答:1

使用Ionic DateTime以2个步骤选择日期和时间:我想使用Ionic DateTime选择日期和时间。问题是pickerFormat =“DD MMMM YYYY HH:mm”的选择器变得复杂而且太窄,所以我想先选择日期,然后选择时间。有关如何这样做的任何想法?

javascript angular ionic-framework ionic2 ionic3
1个回答
3
投票

您可以随时将它们分开

<ion-item [hidden]="!!myDate">
      <ion-label>Date</ion-label>
      <ion-datetime (ngModelChange)="change(datePicker)" displayFormat="MM/DD/YYYY" [(ngModel)]="myDate"></ion-datetime>
    </ion-item>
    <ion-item [hidden]="!myDate" >
      <ion-label>Time</ion-label>
      <ion-datetime #datePicker
      (ionCancel)="myDate=undefined" displayFormat="HH:mm" [(ngModel)]="myTime"></ion-datetime>
    </ion-item>

    <h1 [hidden]="!myTime">result is {{myDate}} : {{myTime}} </h1>

然后在ts

change(datePicker){    
  datePicker.open();
}

然后连接结果

this.dateTime= this.myDate + ":" + this.myTime;

这是一个DEMO

© www.soinside.com 2019 - 2024. All rights reserved.