[英]ionic 2 ion-datetime ISO Format issue
I am using ion-datetime for my appointment form. 我正在使用ion-datetime作为我的预约表格。 While inserting it is working fine without any problem.
插入它时工作正常没有任何问题。 But when I need to update the inserted appointment date form details from back end, the date value is not displaying in ion-datetime.
但是当我需要从后端更新插入的约会日期表单详细信息时,日期值不会显示在ion-datetime中。
Below is my code: 以下是我的代码:
update.html : update.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>
update.ts : update.ts :
leadDetailsUpdate={
appt_date:''
};
The Date format I am getting from back end as follows: appt_date: "2017-01-01"
我从后端获得的日期格式如下:
appt_date: "2017-01-01"
Below is the error message I am getting in console: 以下是我在控制台中收到的错误消息:
Error parsing date: "null". Please provide a valid ISO 8601 datetime format: https://www.w3.org/TR/NOTE-datetime
convert it to ISO format before displaying 在显示之前将其转换为ISO格式
var date = new Date('2017-01-01').toISOString() console.log(date)
Even Gaurav is right, I found that if your timezone is not +0, you can have problems with that. 即使Gaurav是对的,我发现如果你的时区不是+0,你可能会遇到问题。 I found somewhere this solution:
我找到了这个解决方案:
let tzoffset = (new Date()).getTimezoneOffset() * 60000; //offset in milliseconds
this.startTime = (new Date(this.myStartTime - tzoffset)).toISOString().slice(0,-1);
Then in my HTML I have it like this: 然后在我的HTML中我有这样的:
<ion-datetime displayFormat="HH:mm" [(ngModel)]="startTime" (ionChange)="changeCheckOutStartTime()" style="padding-left: 21px"></ion-datetime>
And in the changeCheckOutStartTime()
method, I take the time and create a moment: 在
changeCheckOutStartTime()
方法中,我花时间创建片刻:
changeCheckOutStartTime() {
this.myStartTime = moment(this.startTime).toDate();
}
Using ISO format before displaying, like this: 在显示之前使用ISO格式,如下所示:
this.myDate = new Date('2017-01-01').toISOString()
Will give us a difference of hours, each browser would do something different. 会给我们一个小时的差异,每个浏览器会做一些不同的事情。 In my case I had a difference of 5 hours (16/12/17 02:00 would be 16/12/17 07:00).
在我的情况下,我有5小时的差异(16/12/17 02:00将是16/12/17 07:00)。
A better way would be to use moment as ionic recomends on its documentationn ( https://ionicframework.com/docs/api/components/datetime/DateTime/#advanced-datetime-validation-and-manipulation ) 更好的方法是在其文档中使用时刻作为离子推荐( https://ionicframework.com/docs/api/components/datetime/DateTime/#advanced-datetime-validation-and-manipulation )
Example: 例:
npm install moment --S
. npm install moment --S
。 import moment from 'moment';
import moment from 'moment';
. this.myDate = moment().format()
. this.myDate = moment().format()
。 The best would be create a pipe. 最好的是创建一个管道。 Well check this demo http://plnkr.co/edit/MHjUdC for inspiration, goog luck :)
那么请查看这个演示http://plnkr.co/edit/MHjUdC获取灵感,goog运气:)
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.