AngularJS进阶(二十二)实现时间选择插件
JS实现时间选择插件
引导语
在项目开发过程中,需要实现根据以日期为筛选条件之一,故需要实现时间选择插件。对于未接触的新事物,自己总是感觉不明觉厉。其实,有些实现可以使用很简单的方法即可。以此为例,偶然的一次翻看课本发现HTML5中已经设计到此种实现。其中,设置input元素的type属性为datetime-local即可实现。
问题
实际编码过程中,还是出现了问题。$scope.bill_dateBegin并不能获取到时间选择框中的设置值。
原因
AngularJS support the input type datetime-local since version 1.3.0-beta.1
原来AngularJS 1.3.0-beta.1 极其之上的版本才支持datetime-local的绑定,那就是自己的版本太低导致的了。经过查看版本,发现自己的版本为1.3.0.14,应该不低啊。但实验证明,还是自己的版本过低导致的。尝试使用高版本。
解决方法
尝试使用高版本。但使用1.5.0版本还是没效果!
经过一番询问,还是未能够解决问题。自己尝试着试试type的其它时间类型,当自己使用date类型,发现居然绑定上了,我就呵呵了....而其它的类型例如datetime、datetime-local却无法绑定,费解。我只能说angular还是不够强大!
不过问题还是来了。当自己使用如下语句时,确弹出了下图的信息,而我们则需要这样的格式:2015-12-24 12:00:00。明显日期格式需要进行转换。
bill_dateEnd = $scope.bill_dateEnd;
alert(bill_dateEnd);
有关日期时间的转换问题详见博文《JS抽离公共函数》。
感触
自己的知识面还是比较窄,还是需要多读书《疯狂HTML 5/CSS 3/JavaScript讲义》。
AngularJS进阶(二十二)实现时间选择插件的更多相关文章
- AngularJS进阶(三十二)书海拾贝之特殊的ng-src和ng-href
书海拾贝之特殊的ng-src和ng-href 在说明这两个指令的特殊之前,需要先了解一下ng的启动及执行过程,如下: 1) 浏览器加载静态HTML文件并解析为DOM: 2) 浏览器加载angular. ...
- Java进阶(三十二) HttpClient使用详解
Java进阶(三十二) HttpClient使用详解 Http协议的重要性相信不用我多说了,HttpClient相比传统JDK自带的URLConnection,增加了易用性和灵活性(具体区别,日后我们 ...
- Bootstrap入门(二十九)JS插件6:弹出框
Bootstrap入门(二十九)JS插件6:弹出框 加入小覆盖的内容,像在iPad上,用于存放非主要信息 弹出框是依赖于工具提示插件的,那它也和工具提示是一样的,是需要初始化才能够使用的 首先我们引入 ...
- Bootstrap入门(二十八)JS插件5:工具提醒
Bootstrap入门(二十八)JS插件5:工具提醒 工具提示在使用过程中比较常见,但是实现起来有些麻烦,而bootstrap则很好地解决了这个问题. 我们来写一个简单的实例 先引入CSS文件和JS文 ...
- Bootstrap入门(二十五)JS插件2:过渡效果
Bootstrap入门(二十五)JS插件2:过渡效果 对于简单的过渡效果,只需将 transition.js 和其它 JS 文件一起引入即可.如果你使用的是编译(或压缩)版的bootstrap.js ...
- 网站开发进阶(四十二)巧用clear:both
网站开发进阶(四十二)巧用clear:both 前言 我们在制作网页中用div+css或者称xhtml+css都会遇到一些很诡异的情况,明明布局正确,但是整个画面却混乱起来了,有时候在IE6下看的很正 ...
- Java进阶(五十二)利用LOG4J生成服务日志
Java进阶(五十二)利用LOG4J生成服务日志 前言 由于论文写作需求,需要进行流程挖掘.前提是需要有真实的事件日志数据.真实的事件日志数据可以用来发现.监控和提升业务流程. 为了获得真实的事件日志 ...
- AngularJS进阶(四十)创建模块、服务
AngularJS进阶(四十)创建模块.服务 学习要点 使用模块构架应用 创建和使用服务 为什么要使用和创建服务与模块? 服务允许你打包可重用的功能,使之能在此应用中使用. 模块允许你打包可重用的功能 ...
- Bootstrap <基础二十二>超大屏幕(Jumbotron)
Bootstrap 支持的另一个特性,超大屏幕(Jumbotron).顾名思义该组件可以增加标题的大小,并为登陆页面内容添加更多的外边距(margin).使用超大屏幕(Jumbotron)的步骤如下: ...
- Web 前端开发精华文章推荐(HTML5、CSS3、jQuery)【系列二十二】
<Web 前端开发精华文章推荐>2014年第一期(总第二十二期)和大家见面了.梦想天空博客关注 前端开发 技术,分享各类能够提升网站用户体验的优秀 jQuery 插件,展示前沿的 HTML ...
随机推荐
- Redis和nosql简介,api调用;Redis数据功能(String类型的数据处理);List数据结构(及Java调用处理);Hash数据结构;Set数据结构功能;sortedSet(有序集合)数
1.Redis和nosql简介,api调用 14.1/ nosql介绍 NoSQL:一类新出现的数据库(not only sql),它的特点: 1. 不支持SQL语法 2. 存储结构跟传统关系型数 ...
- HDFS基本原理及数据存取实战
---------------------------------------------------------------------------------------------------- ...
- Android适配难题全面总结
支持多种屏幕 Android 可在各种具有不同屏幕尺寸和密度的设备上运行.对于 应用,Android 系统在不同设备中提供一致的开发环境, 可以处理大多数工作,将每个应用的用户界面调整为适应其显示的 ...
- Leetcode解题-树(5.0.0)基础类
与第二章类似,LeetCode指定了TreeNode实现.为了方便后续习题的编写和测试,创建一个基础父类,包含TreeNode实现,以及create()和print()创建和打印树的方法.其中crea ...
- [csdn markdown]使用摘记一源代码高亮及图片上传和链接
本文主要内容是体验csdn markdown的代码块高亮显示和图片链接及上传. 图片上传 上边这是标题行,只需要使用一个#就可以表示,几个表示是几级标题 图片上传 本地图片上传控件 本地图片上传方式 ...
- FFmpeg源代码简单分析:libswscale的sws_getContext()
===================================================== FFmpeg的库函数源代码分析文章列表: [架构图] FFmpeg源代码结构图 - 解码 F ...
- Simple tutorial for using TensorFlow to compute polynomial regression
"""Simple tutorial for using TensorFlow to compute polynomial regression. Parag K. Mi ...
- 利用并查集+贪心解决 Hdu1232
畅通工程 Time Limit: 4000/2000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others) Total Submi ...
- Google Guava的5个鲜为人知的特性
译文出处: 花名有孚 原文出处:takipi.com Google Guava有哪些比较冷门但却又实用的特性呢? 它是最流行的开源库之一,你应该听过它的大名,它诞生的地方正是人们举办真正的魁地奇比 ...
- EBS DBA指南笔记(一)
第一章 ORACLE APPLICATIONS 的组件与架构 1.ebs组件的几大构成:客户端,form server,web server,concurrent processor,数据库.每个组 ...