Angular Js -moment Picker 时间插件（时间段选择）

Posted 2020-10-05 saygoodnight

Angular Js -moment Picker  时间插件（时间段选择）

一、moment Picker 

　　插件的下载、引用及配置就不在多说了，直接暴力上代码

二、html

<span>{{ctrl.newchoose}}</span>
<span id=‘#showEndTimeError‘
       placeholder="请选择日期"
       moment-picker="ctrl.chooseFormatted"
       format="YYYY-MM-DD HH:mm"
       start-view="day"
       min-date=‘ctrl.minDateMoment‘
       today=‘true‘
       autoclose=‘false‘
       set-on-select =‘false‘
       is-open=‘ctrl["isopen"]‘
       ng-model-options="{ updateOn: ‘blur‘ }"
       change="ctrl.endTimechange(newValue, oldValue)"
       ng-model="ctrl.momentEndDate">点击选择</span>

三、Controller

 

angular
    .module(‘Demo‘, [‘moment-picker‘])
    .config([‘momentPickerProvider‘, function (momentPickerProvider) {
        momentPickerProvider.options({
            locale:"zh-cn",
            minutesStep: 30,

        });
    }])
    .controller(‘DemoController‘, [‘$scope‘, function () {
        var ctrl = this;

        ctrl.isopen = false;
        ctrl.endTimechange =function(newValue, oldValue){
            if(oldValue._i){
                if( newValue._i<oldValue._i){
                    ctrl.startValue = newValue._i.split(" ");
                    ctrl.endValue = oldValue._i.split(" ");
                    if(ctrl.startValue[0] != ctrl.endValue[0] ){
                        alert(‘不能跨天选择‘)
                    }else{
                        ctrl.newchoose = newValue._i +‘-‘+ctrl.endValue[1];
                    }
                    }else {

                    ctrl.startValue = oldValue._i.split(" ");
                    ctrl.endValue = newValue._i.split(" ");
                    if(ctrl.startValue[0] != ctrl.endValue[0] ){
                        alert(‘不能跨天选择‘)
                    }else{
                        ctrl.newchoose = oldValue._i +‘-‘+ctrl.endValue[1];
                    }
                    }
                    console.log(ctrl.newchoose);
                    ctrl.isopen = false;
                    ctrl.chooseFormatted = ‘‘
            }



        }
        //最小值
        ctrl.minDateMoment = moment();
        console.log(moment());
    }]);

 

 

 

　　　　就是这么简单粗暴。——Ps ： 正宗桂林米粉不错。