ionic时间插件(年，月，日，时，分钟)插件

时间插件(分钟，小时，日) ion-datetime-picker
1 安装插件
npm i ion-datetime-picker --save
2 index.html 引入

<script src="lib/ion-datetime-picker/release/ion-datetime-picker.min.js"></script>
<link href="lib/ion-datetime-picker/release/ion-datetime-picker.min.css" rel="stylesheet">

3 app.js中依赖注入

angular.module("myApp", ["ionic", "ion-datetime-picker"]);

4 设置（可不做）
$ionicPickerI18n 依赖注入

$ionicPickerI18n.weekdays = ["日", "一", "二", "三", "四", "五", "六"];
$ionicPickerI18n.months = ["1月", "2月", "3月", "4月","5月", "6月", "7月", "8月", "9月", "10月", "11月", "12月"];
$ionicPickerI18n.ok = "确定";
$ionicPickerI18n.cancel = "取消";
$ionicPickerI18n.okClass = "button-positive";
$ionicPickerI18n.cancelClass = "button-stable";
$ionicPickerI18n.arrowButtonClass = "button-positive";

5 使用
如果只显示到天的话 在html中添加 date

<ion-list>
<div class="item" ion-datetime-picker ng-model="datetimeValue" ng-change="vm.addRemindTime()" title="'请选择日期和时间'">
{{datetimeValue| date: 'yyyy-MM-dd HH:mm:ss'}}
<input type="text" placeholder="请选择时间" ng-model="vm.inputDate" >
</div>
</ion-list>

6 获取
$filter 依赖注入

$filter('date')($scope.datetimeValue,'yyyy-MM-dd HH:mm:ss')

年月插件用法
ionic-monthpicker
1 安装插件
npm i ionic-monthpicker --save
2 index.html 引入

<script src="lib/ionic-monthpicker.min.js"></script>

3 app.js中依赖注入

angular.module("myApp", ["ionic", "ionic-monthpicker"]);

4 使用

<div id="yDateTime" class="homeStart " ng-model="datetime.yueStart" ng-click="showMonthDialog(0,$event)">{{datetime.yueStart | date:"yyyy-MM"}}</div>----------------------------月
<div id="yDateTime" class="homeStart" ng-model="datetime.yearStart" ng-click="showMonthDialogYear(0,$event)"  >{{datetime.yearStart}}</div>-------------------------年

$scope.showMonthDialog = function(i) {
        MonthPicker.init({});
        MonthPicker.show(function(res) {
          console.log(i)
            console.log(res);
            if(res.month<=9){
                var month = res.month
                var months = '0'+ month
            }else{
                var months = res.month
            }
            if(i==0){
              $scope.datetime.yueStart = res.year+'-'+months
            }else{
              $scope.datetime.yueEnd = res.year+'-'+months
            }
        });
    }
    $scope.showMonthDialogYear = function(i) {
        MonthPicker.showYear(function(res) {
            if(i==0){
              $scope.datetime.yearStart = res.year
              console.log($scope.datetime.yearStart)
            }else{
              $scope.datetime.yearEnd = res.year
              console.log($scope.datetime.yearEnd)
            }
            
        });
    }

5 ionic-monthpicker.min.js

!function () { angular.module("ionic-monthpicker", ["ionic"]) } (), function (n) { n.factory("MonthPicker", ["$rootScope", "$ionicPopup", function (n, e) { var t; return { init: function (e) { t = n.$new(), t.minMonthIndex = e.minMonthIndex || 0, t.minYear = e.minYear || (new Date).getFullYear(), t.maxMonthIndex = void 0 === e.maxMonthIndex ? (new Date).getMonth() : e.maxMonthIndex, t.maxYear = e.maxYear || (new Date).getFullYear(), t.monthLabels = e.monthLabels || ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"], t.title = e.title || "请选择", t.cancelText = e.cancelText || "取消", t.cancelClass = e.cancelClass || "button-stable", t.okText = e.okText || "确定", t.okClass = e.okClass || "button-positive", t.selection = { year: e.startingYear || t.maxYear, month: 0 }, t.changeYear = function (n) { t.selection.year += n; t.temps = 13 }, t.temps = (new Date).getMonth(), t.isValidMonth = function (n) { var e = n < t.minMonthIndex && t.selection.year == t.minYear || n > t.maxMonthIndex && t.selection.year == t.maxYear || t.selection.year > t.maxYear; return !e } }, initYear: function (e) { t = n.$new(), t.minYearIndex = e.minYearIndex || 0, t.minYear = e.minYear || (new Date).getFullYear(), t.maxYearIndex = void 0 === e.maxYearIndex ? (new Date).getFullYear() : e.maxYearIndex, t.maxYear = e.maxYear || (new Date).getFullYear(), t.title = e.title || "请选择", t.cancelText = e.cancelText || "取消", t.cancelClass = e.cancelClass || "button-stable", t.okText = e.okText || "确定", t.okClass = e.okClass || "button-positive", t.selection = { year: e.startingYear || t.maxYear }, t.changeYear = function (n) { t.selection.year += n } }, show: function (n) { t.selectMonth = function (n) { if (n == 0) { t.selection = { year: t.selection.year || t.maxYear, month: 0 } } if (n > (new Date).getMonth() || t.selection.year > t.maxYear) { t.isValidMonth(n) } else { t.temps = n } t.temps && t.isValidMonth(n) && (t.selection.month = n) }; var i = e.show({ templateUrl: "monthpicker.html", title: t.title, scope: t, buttons: [{ text: t.cancelText, type: t.cancelClass, onTap: function (e) { n({ year: t.maxYear,month:(new Date).getMonth()+1 }) } }, { text: t.okText, type: t.okClass, onTap: function (e) { n({ year: t.selection.year, month: t.selection.month + 1 }) } }] }) }, showYear: function (n) { var i = e.show({ templateUrl: "monthpickerYear.html", title: t.title, scope: t, buttons: [{ text: t.cancelText, type: t.cancelClass, onTap: function (e) { n({ year: t.maxYear }) } }, { text: t.okText, type: t.okClass, onTap: function (e) { n({ year: t.selection.year }) } }] }) } } }]) } (angular.module("ionic-monthpicker")), angular.module("ionic-monthpicker").run(["$templateCache", function (n) { n.put("monthpicker.html", '<div><style>.month-cell {\n            border: 1px solid #ccc;\n            text-align: center;\n            padding: 10px;\n        }\n        .month-cell.dark {\n            background: #ddd;\n        }\n  .month-cell.sss {\n            background: #0080ff;\n        }\n       .year {\n            font-size:30px;\n        }</style><div class="row year"><div class="col col-25" ng-click="changeYear(-1)"><i class="ion ion-chevron-left"></i></div><div class="col col-50 text-center"><strong>{{ selection.year }}</strong></div><div class="col col-25 text-right" ng-click="changeYear(1)"><i class="ion ion-chevron-right"></i></div></div><div ng-repeat="month in monthLabels"><div class="row" ng-if="$index % 3 == 0" style="padding:0"><div class="col col-33 month-cell" ng-class="[{dark: ! isValidMonth($index)},{sss:temps==$index}]" ng-click="selectMonth($index)">{{ monthLabels[$index] }}</div><div class="col col-33 month-cell" ng-class="[{dark: ! isValidMonth($index + 1)},{sss:temps==$index+1}]" ng-click="selectMonth($index + 1)">{{ monthLabels[$index + 1] }}</div><div class="col col-33 month-cell" ng-class="[{dark: ! isValidMonth($index + 2)},{sss:temps==$index+2}]" ng-click="selectMonth($index + 2)">{{ monthLabels[$index + 2] }}</div></div></div></div>') }]); angular.module("ionic-monthpicker").run(["$templateCache", function (n) { n.put("monthpickerYear.html", '<div><style>.month-cell {\nborder: 1px solid #ccc;\n text-align: center;\n            padding: 10px;\n        }\n        .month-cell.dark {\n            background: #ddd;\n        }\n        .year {\n            font-size:30px;\n        }</style><div class="row year"><div class="col col-25" ng-click="changeYear(-1)"><i class="ion ion-chevron-left"></i></div><div class="col col-50 text-center"><strong>{{ selection.year }}</strong></div><div class="col col-25 text-right" ng-click="changeYear(1)"><i class="ion ion-chevron-right"></i></div></div>') }]);