AngularJS 日期时间选择组件(附详细使用方法)
2021-01-18 20:09
1011 查看
插件简介
AngularJS是一款目前非常火的JavaScript脚本库,应用范围十分广阔。今天给大家分享一款基于AngularJS和jQuery的日期时间选择组件,和别的日期选择插件一样,它同样支持年月日的快速定位。另外这款AngularJS日期选择组件还支持时间的选择,精确到秒。
1.在你的项目引入wui.css或wui.min.css,以及font图标文件(与wui.css文件同级)
<link rel="stylesheet" type="text/css" href="css/wui.min.css">
2.在你的项目引入wui-date.js或wui-date.min.js,依赖angular.js
<script type="text/javascript" src="js/angular.js" charset="utf-8"></script> <script type="text/javascript" src="js/wui-date.js" charset="utf-8"></script>
3.在你的项目引入wuiDate依赖
var app = angular.module('app',["wui.date"]);
4.在页面使用wui-date组件
<wui-date format="yyyy-mm-dd hh:mm:ss" placeholder="请选择或输入日期" id="date4" btns="{'ok':'确定','now':'此刻'}" ng-model="date4" > </wui-date>
插件预览
插件下载
在线演示链接:
https://www.html5tricks.com/demo/angularjs-datetime-picker/index.html
插件下载链接:
https://www.html5tricks.com/download/angularjs-datetime-picker.rar
解压密码:RJ4587
相关文章推荐
- 日期时间选择控件配置使用方法
- Bootstrap3 日期+时间选择控件 datetimepicker的使用方法说明
- 在使用element ui时DatePicker 日期选择器组件获取时间格式问题
- Bootstrap日期和时间表单组件使用方法
- 微信小程序日期时间选择器使用方法
- IOS--UIDatePicker 时间选择器 的使用方法详细
- python GUI库图形界面开发之PyQt5日期时间控件QDateTimeEdit详细使用方法与实例
- Android之日期时间选择器使用方法
- Android中TimePicker与DatePicker时间日期选择组件的使用实例
- 使用WdatePicker日期组件时,选择日期后,执行某个方法
- Androin 常用组件下拉框日期选择器、时间选择器、RadioButton、CheckBox使用
- bootstrap之datetimepicker(日期时间选择器)插件详细使用方法
- 安卓原生自带的日期选择器DatePickerDialog、时间选择器TimePickerDialog使用方法
- iOS--UIDatePicker 时间选择器 的使用方法详细
- struct tm 和 time_t 时间和日期的使用方法
- 【转】struct tm 和 time_t 时间和日期的使用方法
- SQLite3使用方法大全(三)之日期&时间
- struct tm 和 time_t 时间和日期的使用方法(转)
- mysql的函数concat的,drop语句使用、列结构、所有变量、VERSION、CURRENT_DATE、支持selec+/ USER()支持详细时间计算方法
- 在Python中操作日期和时间之gmtime()方法的使用