html5 date input 与angularjs ng-model数据绑定
19 July 2015

1、<input type="date">取到的数据是标准的ISO 8601 格式的时间

2、angularjs 对type="date"取到的数据必须是new Date()得到的date类型的数据。

这两种类型需要相互转换,才能让ng-model的date类型的数据正确显示。

eg:服务器要存储的是iso类型的时间字符串。如:2015-07-19T11:20:38.172Z

展现时,先要通过new Date(‘2015-07-19T11:20:38.172Z’)将数据转换成标准的Date类型,再绑定到input type='model'的ng-model上。

将数据提交到服务器前要将数据new Date('2015-07-19T11:20:38.172Z').toISOString(),通过Date的toISOString方法转换成ISO时间格式。

(有些服务器在存储时间格式的数据时,会将字符串先转换成对象。如leanCloud的存储服务,会将传递的'2015-07-19T11:20:38.172Z'转换成:

{
	__type: 'date',
	iso: '2015-07-19T11:20:38.172Z'
} )

iso 8601数据格式

  • 格式: YYYY-MM-DDTHH:mm:ss.sssZ

    • YYYY:格林尼治时间从0000到9999
    • MM:月(01-12)
    • DD:日期(01-31)
    • T :时间开始标识符
    • HH:小时(00-24)
    • mm:分钟(00-59)
    • ss:秒(00-59)
    • sss: 毫秒数
    • Z:时区标识符,Z代表UTC 0时区,我们实在东8区。
  • 时区参数非常重要,如果你不指定时区,默认是Z,0时区,但是转化给用户看时是当前客户端所在的时区对应的时间。

  • 比较奇葩的是00:00和24:00这2个分界点是相同的时间,也就是说2015-07-19T24:00 和 2015-07-19T00:00时间相同。

黄金外链

https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Date

http://tools.ietf.org/html/rfc2822#page-14