项目需要在移动端集成时间选择组件，根据已有实施经验与查询的相关资料，给出以下3种方式

jQueryDate rolldate Zorro Mobile Date 组件 ionic 自带
上手难度 简单 简单 直接使用简单、封装稍复杂 简单
使用限制 依赖 jQuery 无 至少需要 Angular 6 以上（截止到2020-04-10已支持Angular 8）
Angular 6 中目前测试可以运行的最高版本是 0.11.4 (2019-02-14)		 安装 ionic，参照 api 实现即可
存在的问题
- 自定义程度不高
- 滑动效果生硬
 自定义程度不高
- 某些版本可能存在 minDate 无法选择的问题（0.11.4 后的版本已修复）
- maxDate 如果设置 2020-04，那默认值设置 2019-12，可能默认会显示 2019-04，也就是说默认显示时年和月是分别限制的，但是滚动不影响（2019 年可以滚定选择 12 个月），目前不清楚是否已修改
- 滑动的效果过于灵敏，稍不注意就滑过了
 自定义程度不高
页面效果 精细 精细 精细 简陋
适用场景 一般情况下都可以使用
但是对于某些设计上有要求，对时间筛选的功能组件进行拆分重组的情况下，不太适用		 rolldate是jquery.date的升级版本，体积相对而言会大一些。可以作为原生类的首选方案 框架在 Angular6+ionic4 以后可以使用。
自定义程度比较高的推荐使用（目前市面上能够将时间面板单独拆出，直接提供出来的，暂时没有发现第 2 家）		 除非没办法，一般不建议使用（如果后面ionic更新样式美化了可以再考虑）

原生类方法

jQueryDate

引入

全局引入

在typings.d.ts中加入 declare var Jdate: any;

单模块引入

在使用的模块ts文件中加入 declare var Jdate: any;

使用

HTML
原始的demo中只提供了input的dom，但实际上也可以使用div的方式，只要id定义了即可

  1. <div id="test"><div>

TypeScript

  1. new Jdate({
  2.     el: '#test',  // 绑定插件的 dom 元素，使用jquery语法
  3.     format: 'YYYY-MM',  // 日期格式
  4.     beginYear: 2000,  // 日期开始年份
  5.     value: '2018-01',  // 日期初始化默认值
  6.     endYear: new Date().getFullYear(),   // 日期结束年份
  7.     confirm: (date) => {  // 确认按钮触发前的回调函数
  8.         const tempData = date.replace(/-/g, '');
  9.         return tempData;  
  10.           // return false;  // return false 可阻止插件执行，页面不关闭，选中值不赋值
  11.           // 可以对显示的数据做处理，但是不影响绑定的数据值，
  12.           // 也就是说显示的可以变成2019年12月，但是绑定的值还是2019-12
  13.     }
  14. })

更详细的代码可以在示例demo中查阅
jDate.js.zip

rolldate

rolldate的使用方法与jDate基本一致，引用方式上可能需要注意一下，未测试，可能还是用 declare var 方式引入

插件类

zorro mobile

使用方法参考本篇文章
语雀内容

ionic

使用ios模式的样式还可以，其余的参照文献3的api实现即可

参考文献

  1. jquery 移动端时间插件 jquery.date.js
  2. ws1993/rolldate: :clock10:rolldate 多格式、功能强大的移动端日期选择插件
  3. ion-datetime - Ionic Documentation