离子 2 离子日期时间 ISO 格式问题

Question

我正在使用离子日期时间作为我的预约表格。插入时，它可以正常工作，没有任何问题。但是当我需要从后端更新插入的约会日期表单详细信息时，日期值不会显示在离子日期时间中。

下面是我的代码：

更新.html：

<ion-item class="border-bottom">
      <ion-label  class="ionselect" >Appointment Date:</ion-label>
      <ion-datetime name="appdate" displayFormat="YYYY MMM DD" [(ngModel)]="leadDetailsUpdate.appt_date"></ion-datetime>
</ion-item>

更新.ts：

leadDetailsUpdate={
        appt_date:''
}; 

我从后端获得的日期格式如下： appt_date: "2017-01-01"

以下是我在控制台中收到的错误消息：

Error parsing date: "null". Please provide a valid ISO 8601 datetime format: https://www.w3.org/TR/NOTE-datetime

Answer 1

在显示之前将其转换为ISO格式

var date = new Date('2017-01-01').toISOString()
console.log(date)

Answer 2

即使高拉夫是对的，我发现如果你的时区不是+0，你可能会遇到问题。我在某处找到了这个解决方案：

let tzoffset = (new Date()).getTimezoneOffset() * 60000; //offset in milliseconds
this.startTime = (new Date(this.myStartTime - tzoffset)).toISOString().slice(0,-1);

然后在我的 HTML 中，我有这样的：

<ion-datetime displayFormat="HH:mm" [(ngModel)]="startTime" (ionChange)="changeCheckOutStartTime()" style="padding-left: 21px"></ion-datetime>

在changeCheckOutStartTime()方法中，我花时间创造一个时刻：

changeCheckOutStartTime() {
   this.myStartTime = moment(this.startTime).toDate();
}

Answer 3

在显示之前使用 ISO 格式，如下所示：

this.myDate = new Date('2017-01-01').toISOString()

会给我们一个小时的差异，每个浏览器都会做一些不同的事情。就我而言，我相差 5 小时(16/12/17 02：00 将是 16/12/17 07：00(。

更好的方法是使用时刻作为其文档的离子推荐(https://ionicframework.com/docs/api/components/datetime/DateTime/#advanced-datetime-validation-and-manipulation(

例：

1. 在根设备上打开控制台并安装时刻：npm install moment --S 。
2. 组件文件中的导入力矩：import moment from 'moment'; .
3. 模型变量设置值：this.myDate = moment().format() 。

最好的方法是创建一个管道。好吧，请查看此演示 http://plnkr.co/edit/MHjUdC 以获取灵感，好运气:)