【时间选择器开始时间和结束时间之间相互限制关系问题 _angular内置指令和方法】

时间选择器开始时间和结束时间之间相互限制关系问题

我也踩过这个坑( 1 )

已统计您的踩坑,无需重复点击

回答(0)

angular内置指令和方法

详细描述

截图

代码

//开始时间设置条件
    $scope.startDateOptions = {
        formatYear: 'yy',
        maxDate:$scope.dtEnd
    };
    
    //结束时间设置条件
    $scope.endDateOptions = {
        formatYear: 'yy',
        maxDate: new Date(), //最大时间不超过当天
        minDate: $scope.dtStart, //最小时间不超过开始时间
        startingDay: 1
    };
    //结束时间没有选时，自动给结束时间赋值为当天
    console.log("开始时间最大限制:"+$scope.startDateOptions.maxDate);
    if($scope.dtEnd==undefined){
        $scope.startDateOptions.maxDate = new Date();//结束时间为空时，最大开始时间设置为当前时间
    }
    console.log('开始时间最大限制:'+$scope.startDateOptions.maxDate);
    console.log('结束时间最大限制:'+$scope.endDateOptions.maxDate);
    console.log('结束时间最小限制:'+$scope.endDateOptions.minDate);
    $scope.$watch('dtStart', function (newValue, oldValue) {
        $scope.endDateOptions.minDate = newValue;
        //监视开始时间的变化
    });
    $scope.$watch('dtEnd', function (newValue, oldValue) {
        //监视结束时间的变化
        if($scope.dtEnd==undefined){
            $scope.startDateOptions.maxDate = new Date();//结束时间为空时，最大开始时间设置为当前时间
        }
        else{
            $scope.startDateOptions.maxDate = newValue;//选择结束时间，最大开始时间设为结束时间
        }
        console.log($scope.dtEnd);
    });

//清空按钮
    $scope.empty = function () {
        $state.go('backstage.list', { //发起清空请求，清空url上参数
            type: null,
            status: null,
            startAt: undefined,
            endAt: undefined,
            page: null
        });      
        $scope.styleName = undefined; //给类型值，状态值，开始和结束时间赋空值
        $scope.stateName = undefined;
        $scope.dtStart = undefined;
        $scope.dtEnd = undefined;

    };

编辑于2024-11-23