美文网首页Ionic 2 花瓣 ..my ionic3
ionic2 ion-datetime 设置初始化开始结束时间

ionic2 ion-datetime 设置初始化开始结束时间

作者: 天亮前被寻找的一只猫 | 来源:发表于2017-07-08 14:48 被阅读3697次

    如图,需求是通过Ionic2 的 ion-datetime  实现一个时间选择器.  

    因为展示的初始化时间是从上个页面带过来的. 所以需要用到三个参数:

    [(ngModel)]="times.start"    即当前展示的时间

    [min]="times.min"  可选择的最小时间

    [max]="times.max"    可选择的最大时间

    我从上个页面传递过来的时间,时间格式是 YYYY-MM-DD HH:mm  输出结果 2017-07-08 05:52:00

    但是在ionic2 上设置的时间格式是要 用ISO 标准  即:  toISOString()  返回 Date 对象的字符串格式   

     输出结果 2017-07-08T05:52:00.486Z

    这尼玛,首先想到的是,后台返给我的数据为啥不是时间戳呢?如果是时间戳,直接 new Date(时间戳).toISOString();  不就完事了嘛

    然后我现在就需要  将YYYY-MM-DD HH:mm 格式的数据 转换成时间戳[步骤一], 然后再new Date(时间戳).toISOString()  [步骤二];

    步骤一:      this.start= new Date(上个页面传过来的固定格式的时间).getTime()+8*3600*1000;  这样就拿到时间戳了

    步骤二:      this.times.start = new Date(this.start).toISOString();   转换完成后,这就是ISO格式的时间了.

    经测试,google 调试模式下,安卓手机上 都能准确显示, 未读苹果设备上无法显示...why? 这么坑?

    改了一上午也没弄清楚头绪. 最后根据经验判断,是因为这两次数据的转换涉及到计算, 从而导致页面跳转过去的时候,数据还没来得及渲染上去...  也就是说 这两次计算 造成的效率问题,影响了渲染展示.

    然后,朋友直接就用  replace(' ','T')+'Z';   完美解决.

    对啊  怎么就没想到之别把 2017-07-08 05:52:00  转换成 2017-07-08T05:52:00.486Z这种数据格式呢?

    然后经过测试,最后完美解决了苹果端 设置初始化时间无效的问题.

    相关文章

      网友评论

      • ed91c134ad6f:请问,当要离开当前页面时,用户没有点击取消,所以日期选择器无法自动收回,这个BUG要怎么解决呢?
      • 木子水吉_08:怎么做到的呢?我这里不行哎

      本文标题:ionic2 ion-datetime 设置初始化开始结束时间

      本文链接:https://www.haomeiwen.com/subject/meodhxtx.html