解析日期时出错请提供有效的 ISO 8601 日期时间 Ionic

Question

我已将日期保存在服务器数据库中作为时间戳。

然后我使用下面的代码将时间戳转换为日期

completeDate : new Date(timestamp);


It shows date : Wed Feb 28 2018 00:35:06 GMT+0530 (IST)

但是当我尝试设置 ion-datetime 时。它抛出错误

    <ion-datetime displayFormat="MM/DD/YYYY" [(ngModel)]="history.completeDate"></ion-datetime>

解析日期时出错：“2018 年 2 月 28 日星期三 00:35:06 GMT+0530 (IST)”。请提供有效的 ISO 8601 日期时间格式：https://www.w3.org/TR/NOTE-datetime

谁能帮我解决这个问题

Answer 1

当我查看文档时，我发现了以下内容：

Ionic 使用 ISO 8601 日期时间格式作为其值。该值只是一个字符串，而不是使用 JavaScript 的 Date 对象。此外，使用 ISO 日期时间格式时，可以更轻松地在 JSON 对象内进行序列化和传递，并向数据库发送标准化格式，以便在需要时可以轻松解析该格式。

还有 ISO 8601 日期时间格式：

YYYY-MM-DDTHH:mmZ

Javascript日期对象可以转换许多字符串格式，但是这个特定组件需要ISO 8601格式的字符串，因此您需要进行进一步的转换。

Answer 2

就像 @Animator 所说，您需要 ISO 8601 日期时间格式。

因此，您必须将类型定义为字符串并将值设置为：

completeDate : (new Date(timestamp)).toISOString();

有关 Date.prototype.toISOString() 的更多信息

Answer 3

我尝试根据给定的日期格式手动创建 ISO 字符串 - 在我的例子中：(dd-MMM-yyyy)

function xx_formatDate(p_date){
                //to resolve error - "Please provide valid ISO 8601 string."
                if(p_date){
                    let formattedDate = new Date(p_date);
                    let dateArr = formattedDate.toLocaleDateString().split('/');
                    let l_year = dateArr[2];
                    let l_month = dateArr[0];
                    let l_date = dateArr[1];
                    l_month = (l_month.length>1)? l_month : '0'+l_month;
                    l_date = (l_date.length>1)? l_date : '0'+l_date;

                    return l_year+'-'+l_month+'-'+l_date;
                } else {
                    return ;
                }
            }

Answer 4

    <ion-item>
            <ion-input
              label="Fecha del Documento"
              label-placement="floating"
              value="{{ note.date | date: 'dd/MM/yyyy' }}"
              id="date"
            ></ion-input>
            <ion-icon
              slot="end"
              name="calendar-outline"
              color="white"
              class="icon-overlay"
            ></ion-icon>
            <ion-popover
              size="cover"
              trigger="date"
              show-backdrop="false"
              [dismissOnSelect]="true"
            >
              <ng-template>
                <ion-datetime
                  #popoverDatetime
                  [(ngModel)]="dateFormat"
                  (ngModelChange)="pickDateModelChange($event)"
                  presentation="date"
                  locale="es-ES"
                ></ion-datetime>
              </ng-template>
            </ion-popover>
          </ion-item>
    component ts

    dateFormat: string = this.note.date.toISOString();
    pickDateModelChange(dateValue: any): void {
        console.log(this.dateFormat)
        this.note.date = new Date(this.dateFormat);
      }