在 ionic ion-datetime 字段中显示未来日期

Posted 2023-02-24

【中文标题】在 ionic ion-datetime 字段中显示未来日期

【英文标题】：Displaying future dates in ionic ion-datetime field

【发布时间】：2022-01-23 23:03:58

【问题描述】：

我正在尝试在 ionic 4 应用程序中创建一个 ion-datetime 输入字段，但问题是未来几年没有显示！相反，它只显示当前和过去的日期。 但由于它是一个“待办事项”表单，我希望用户只选择当前日期或未来日期。那么我该如何解决这个问题呢？

这些是我的“离子日期时间”字段：

<ion-item>
    <ion-label>Start Time</ion-label>
    <ion-datetime 
    pickerFormat="D M YYYY h m A" 
    displayFormat="YYYY MMMM DD HH mm"
     [(ngModel)]="StartTime">
    </ion-datetime>
  </ion-item>

  <ion-item>
    <ion-label>End Time</ion-label>
    <ion-datetime 
    pickerFormat="D M YYYY h m A" 
    displayFormat="YYYY MMMM DD HH mm"
    [(ngModel)]="EndTime">
    </ion-datetime>
  </ion-item>

这些是显示的日期：

如果您需要任何额外信息来帮助您解决我的问题，请让我这样做。

【问题讨论】：

[yearValues]="[2022, 2023, 2024]" 你可以使用它来选择年份，对于结束时间选择器，使用 [min]="start_date.value"，然后在开始时间选择器将 #start_date 和 [min]="min_start_time" 和 min_start_time 你在 ts 文件中声明，它将等于 new Date().toISOString();所以这样你在第一个日期选择的值将强制第二个选择器从那个点开始......

【参考方案1】：

strong text您可以提供最大或最小组件属性，例如：

<"ion-datetime min="1994-03-14" max="2099-12-09" ></ion-datetime">

动态最小值和最大值：

TS：

minYear = '2021';
maxYear = '2025-10-31'; // based on your calculations;

html：

<"ion-datetime [min]="minYear" [max]="maxYear" ></ion-datetime">

【讨论】：

问题是我想根据当前日期设置动态最小值和最大值，我该怎么做呢？

你可以使用[min]="YourMinVariable"[max]="yourMaxVariable"。