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日期选择插件的更多相关文章

  1. 移动设备日期选择插件(基于JQUERY)

    上周花了2个小时写的一个日期选择插件,比较适合移动端的设备.先看个效果图吧.如果刚好是你需要的就往下吧,不需要的也可以继续..... 其实网络上已经有的了类似的成熟插件,比如基于mobiscroll, ...

  2. 贴近用户体验的jQuery日期选择插件

    分享一款贴近用户体验的jQuery日期选择插件.这是一款双日历jQuery日期选择时间插件pickerDateRange.效果图如下: 在线预览   源码下载 var dateRange = new ...

  3. 纯原生js移动端日期选择插件

    最近在项目上需要使用日期选择插件,由于是移动端的项目,对请求资源还是蛮节约的,可是百度上一搜,诶~全是基于jquery.zepto的,本来类库就很大,特别像mobiscroll这种样式文件一大堆又丑又 ...

  4. EasyUI 日期选择插件封装成选择到月份的插件

    将普通的日期选择插件封装成选择到月份的插件:                     var nowMonth = new Date();                    var month = ...

  5. 【jquery】多日期选择插件easyui date

    1.本次介绍一个好用的 多日期选择插件:EasyUI date,适用于:需要一次性选择多个日期,无需手动一个一个进行添加. 2.效果图: 3.下载地址:http://www.jeasyui.com/d ...

  6. 推荐三款日期选择插件(My97DatePicker+jquery.datepicker+Mobiscroll)

    1.My97DatePicker 纯原生JS,专注于PC端,支持IE6+:页面上只需要引入WdatePicker.js文件,但是My97DatePicker整个目录是一个整体,最好不要破坏里面的目录结 ...

  7. 日期选择插件clndr的使用

    需求是:在HTML中绘制日历直接供用户选择 而不是使用datepicker之类的表单插件让用户点击input后弹出datepicker让用户选择 浏览了一些解决方案后,发现  CLNDR 这个jQue ...

  8. HTML5 input date属性引起的探索——My97DatePicker(日期选择插件)

    不得不说H5的input date属性真的好用,之前我写的http://www.cnblogs.com/tu-0718/p/6729274.html这篇博客里面也有提到,不过虽然移动端对H5的支持还是 ...

  9. Vue中的v-model与my97日期选择插件冲突

    Vue中的v-model指令只是一个语法糖,其具体实现是:监听input框的input事件,然后将用户输入的值赋值给input框的value属性 <input type="text&q ...

随机推荐

  1. selenium 实现浏览器 前进和后退

    #coding=utf-8from selenium import webdriver driver = webdriver.Chrome()driver.get("https://www. ...

  2. Python 爬虫实例(5)—— 爬取爱奇艺视频电视剧的链接(2017-06-30 10:37)

    1. 我们找到  爱奇艺电视剧的链接地址 http://list.iqiyi.com/www/2/-------------11-1-1-iqiyi--.html 我们点击翻页发现爱奇艺的链接是这样的 ...

  3. mysql 导入导出数据库、数据表的方法

    mysql 导入导出数据库.数据表的方法. Linux操作系统中,均在控制台下操作.1,导入数据库:前提:数据库和数据表要存在(已经被创建)(1)将数据表 test_user.sql 导入到test ...

  4. CGameConfig类

    #ifndef __GAMECONFIG_H__ #define __GAMECONFIG_H__ #include "GameFrameHead.h" #include &quo ...

  5. Debian7/8安装最新的nginx稳定版本

    我们知道,通过 apt-get install nginx 就可以安装上nginx,可惜这样安装的nginx版本都有些旧,就连最新的Debian 8.0 默认安装的仍然是1.6.2,更别说 Debia ...

  6. H3C路由器和交换机的一些记录

    一.模拟器安装需要先安装winpcap,模拟器的脚本是tcl,使用脚本根据拓扑图可以配置模拟器模拟实际的网路线路和设备.二.和模拟器的连接可以使用超级终端,但是超级终端使用的是双字符,这里使用的是Se ...

  7. 针对16v554(ttyS0-15)的ttyAT0的login配置

    1 ## /etc/inittab# console::sysinit:/etc/init.d/rcSconsole::respawn:/sbin/getty -L 115200 ttyAT0 vt1 ...

  8. Oracle拉出在sqlserver建表的语句

    我们将Oracle数据同步到sqlserver时,是先得在sqlserver端建表的. 复杂的字段我们不同步,就仅仅考虑以下四种数据类型. Oracle到SQLServer做的映射: int -> ...

  9. HeadFisrt 设计模式03 装饰者

    类应该对扩展开放, 对修改关闭. 所谓装饰者模式, 是指用其他的类来装饰某个类, 装饰者说白了就是使用 has-a 来代替 is-a 隐喻 咖啡店, 有很多种咖啡, 咖啡里还要增加一些 milk, 面 ...

  10. KMP + 求最小循环节 --- HDU 1358 Period

    Period Problem's Link: http://acm.hdu.edu.cn/showproblem.php?pid=1358 Mean: 给你一个字符串,让你从第二个字符开始判断当前长度 ...