angular中使用bootstrap-datetimepicker

前言

由于工作中的需要，自己查找了关于angular有关的日期插件，但是觉得样式或者需求没能满足自己的需求，所以自己就是用jquery的bootstrap-datetimepicker插件封装成angular指令，实现了自己的需求，但是在实现的过程中发现还是有些问题存在，希望看到的朋友能够帮助解决。

---

需求

1. 根据选择的’日期格式’，来设置：最小日期、最大日期、和当前日期，每个日期的设置都要在正确的范围内，如果不正确的设置要有提示信息
2. 实现三种控件：日期格式、日期时间格式、时间格式
3. 日期格式： yyyy-mm-dd 、 yyyy/mm/dd 、yyyy年mm月dd日
4. 时间格式：hh:ii 、 hh:ii:ss 、HH:ii 、HH:ii:ss

实现

1. 封装angular自定义指令myDatetime,具体解释见代码注释
2. 格式化时间的工具是javascript库moment.js

注意事项

1. element.datetimepicker({autoclose:true}) 可以在设置日期之后自动关闭日期框，但是如果手动的设置的话，就不要设置这个属性了
2. 利用element.datetimepicker().on('changeDate', function(e){console.log(e.date)})监视日期的变化的时候，如果要手动设置要在设置之前，先关闭日期框 element.datetimepicker('hide')再手动赋值
3. 在中文日期设置的时候，点击出现日期框的时候有时候是从1899年开始的，我在点击显示之前先清除日期插件element.datetimepicker('remove');,好像有时候也还是会出现，不知道怎么处理，是不是插件有bug？
4. 时间设置比较大小的时候我是单独转化为秒，然后再比较大小。

资料链接

1. https://github.com/smalot/bootstrap-datetimepicker
2. https://www.malot.fr/bootstrap-datetimepicker/

实现效果图展示

demo

http://zjrzpp.gitee.io/datetimedemo/