angular2+ 引用layDate日期选择插件
layDate日期选择插件使用npm安装好像是行不通的,但angular2+的日期选择控件库又不能够支持时分秒的选择
在angular项目中引用layDate
1. 首先官网下载layDate独立版,把laydate文件夹下的文件放入assets文件夹下

2. 在angular-cli.json文件里添加
"styles": [
"assets/theme/default/laydate.css"
],
"scripts": [
"assets/laydate.js"
],
3. 打开laydate.js文件搜索 modules/laydate/":"theme/
改为 modules/laydate/":"assets/theme/
4. 使用的时候在组件ts里声明,然后在页面初始化的时候创建实例
html页面
<input type="text" id="s" />
ts文件
declare let laydate;
ngOnInit() {
laydate.render({
elem:'#s', // s为页面日期选择输入框的id
type:'datetime',
theme:'#0c6acf',
done:(value, date, endDate)=>{
this.addleaveApplyParams.startLeave = value
console.log(value)
console.log(date)
console.log(endDate)
}
})
}
以上,就可以在angular项目中使用laydate~更多用法见官网
angular2+ 引用layDate日期选择插件的更多相关文章
- 移动设备日期选择插件(基于JQUERY)
上周花了2个小时写的一个日期选择插件,比较适合移动端的设备.先看个效果图吧.如果刚好是你需要的就往下吧,不需要的也可以继续..... 其实网络上已经有的了类似的成熟插件,比如基于mobiscroll, ...
- 贴近用户体验的jQuery日期选择插件
分享一款贴近用户体验的jQuery日期选择插件.这是一款双日历jQuery日期选择时间插件pickerDateRange.效果图如下: 在线预览 源码下载 var dateRange = new ...
- 纯原生js移动端日期选择插件
最近在项目上需要使用日期选择插件,由于是移动端的项目,对请求资源还是蛮节约的,可是百度上一搜,诶~全是基于jquery.zepto的,本来类库就很大,特别像mobiscroll这种样式文件一大堆又丑又 ...
- EasyUI 日期选择插件封装成选择到月份的插件
将普通的日期选择插件封装成选择到月份的插件: var nowMonth = new Date(); var month = ...
- 【jquery】多日期选择插件easyui date
1.本次介绍一个好用的 多日期选择插件:EasyUI date,适用于:需要一次性选择多个日期,无需手动一个一个进行添加. 2.效果图: 3.下载地址:http://www.jeasyui.com/d ...
- 推荐三款日期选择插件(My97DatePicker+jquery.datepicker+Mobiscroll)
1.My97DatePicker 纯原生JS,专注于PC端,支持IE6+:页面上只需要引入WdatePicker.js文件,但是My97DatePicker整个目录是一个整体,最好不要破坏里面的目录结 ...
- 日期选择插件clndr的使用
需求是:在HTML中绘制日历直接供用户选择 而不是使用datepicker之类的表单插件让用户点击input后弹出datepicker让用户选择 浏览了一些解决方案后,发现 CLNDR 这个jQue ...
- HTML5 input date属性引起的探索——My97DatePicker(日期选择插件)
不得不说H5的input date属性真的好用,之前我写的http://www.cnblogs.com/tu-0718/p/6729274.html这篇博客里面也有提到,不过虽然移动端对H5的支持还是 ...
- Vue中的v-model与my97日期选择插件冲突
Vue中的v-model指令只是一个语法糖,其具体实现是:监听input框的input事件,然后将用户输入的值赋值给input框的value属性 <input type="text&q ...
随机推荐
- Json映射为Map,避免定义过多pojo类
我们在开发过程中经常会遇到解析Json字符串的情况,这时候采用开源工具可以快速将json字符串映射为pojo对象.而在某些业务场景中,往往为了获得json字符串中某个属性的值而不得不定义一个pojo类 ...
- 【ecshop后台详解】系统设置-商店设置
商店设置是我们ecshop新用户第一步先要设置的地方,因为里面相当于网站的基础.包括公司名称,电话,地址,tittle等重要的信息都是这里修改,如果这里没有修改的话,如果有访客来到你网站可能以为走错了 ...
- 信号处理函数(3)-sigaction() 为信号注册信号捕捉函数
定义: int sigaction(int signum,const struct sigaction *act ,struct sigaction *oldact); 表头文件: #include& ...
- 02、Windows Phone 套接字(Socket)实战之服务器端设计
这里主要写 PC 服务器端的逻辑,UI 使用的是 WPF,因为 WPF 比普通的 WinForm 的流式布局 更容易控制,而且比 WinForm 美观一些,显示截图: 一.页面 UI MainWind ...
- oracle锁表,杀死进程
查询锁表数据 select object_name,machine,s.sid,s.serial#from v$locked_object l,dba_objects o ,v$session swh ...
- Android 开发之Android 应用程序如何调用支付宝接口
1.到支付宝官网,下载支付宝集成开发包 由于android设备一般用的都是无线支付,所以我们申请的就是支付宝无线快捷支付接口.下面是申请的地址以及下载接口开发包的网址:https://b.alipay ...
- 文件操作之格式化IO
其实在我使用最多的文件操作中,还是喜欢格式化IO控制的方式,简单方便易理解. #include <stdio.h> #include<stdlib.h> int main() ...
- poj2559单调栈
题意:给出连续的矩形的高....求最大面积 #include<iostream> #include<stack> #include<stdio.h> using n ...
- UCOS2_STM32移植详细过程(汇总)
Ⅰ.概述 笔者发现一个问题,很多初学者,甚至很多工作一两年的人,他们有一种依赖的思想,就是希望从别处获取的软件代码不做任何修改,直接可以运行或者使用.笔者想说,实践才是检验真理的关键,实践才是掌握知识 ...
- (转)maven3.3.9编译oozie4.3.0
1.Java版本1.8 [root@sht-sgmhadoopdn-04 app]# java -versionjava version "1.8.0_66"Java(TM) SE ...