Question

我正在使用Here

中的日期选择器

一切似乎都有效，它会更新模型等但由于某种原因，它会将所选日期设置为比用户点击的值早1天。

这是我的控制器。

TodoApp.controller('DatePickCtrl', function ($scope) {
    $scope.today = function () {
        $scope.DueDate = new Date();
    };
    $scope.today();

    $scope.clear = function () {
        $scope.DueDate = null;
    };

    // Disable weekend selection
    $scope.disabled = function (date, mode) {
        return (mode === 'day' && (date.getDay() === 0 || date.getDay() === 6));
    };

    $scope.toggleMin = function () {
        $scope.minDate = $scope.minDate ? null : new Date();
    };
    $scope.toggleMin();

    $scope.open = function ($event) {
        $event.preventDefault();
        $event.stopPropagation();

        $scope.opened = true;
    };

    $scope.dateOptions = {
        formatYear: 'yy',
        startingDay: 1
    };

    $scope.formats = ['dd-MMMM-yyyy', 'yyyy/MM/dd', 'dd.MM.yyyy', 'shortDate'];
    $scope.format = $scope.formats[0];

    var tomorrow = new Date();
    tomorrow.setDate(tomorrow.getDate() + 1);
    var afterTomorrow = new Date();
    afterTomorrow.setDate(tomorrow.getDate() + 2);
    $scope.events =
      [
        {
            date: tomorrow,
            status: 'full'
        },
        {
            date: afterTomorrow,
            status: 'partially'
        }
      ];

    $scope.getDayClass = function (date, mode) {
        if (mode === 'day') {
            var dayToCheck = new Date(date).setHours(0, 0, 0, 0);

            for (var i = 0; i < $scope.events.length; i++) {
                var currentDay = new Date($scope.events[i].date).setHours(0, 0, 0, 0);

                if (dayToCheck === currentDay) {
                    return $scope.events[i].status;
                }
            }
        }

        return '';
    };
});

这是我的加价。

<div class="col-xs-12" ng-controller="DatePickCtrl">
        <label>Due Date</label>
        <div class="row">
            <div class="col-md-6">
                <p class="input-group">
                    <input type="text" class="form-control" datepicker-popup="{{format}}" ng-model="item.DueDate" is-open="opened" min-date="minDate" max-date="'2015-06-22'" datepicker-options="dateOptions" date-disabled="disabled(date, mode)" ng-required="true" close-text="Close" />
                    <span class="input-group-btn">
                        <button type="button" class="btn btn-default" ng-click="open($event)"><i class="glyphicon glyphicon-calendar"></i></button>
                    </span>
                </p>
            </div>
        </div>
        <div class="row">
            <div class="col-md-6">
                <label>Format:</label> <select class="form-control" ng-model="format" ng-options="f for f in formats"><option></option></select>
                <button type="button" class="btn btn-sm btn-info" ng-click="today()">Today</button>
                <button type="button" class="btn btn-sm btn-danger" ng-click="clear()">Clear</button>
                <button type="button" class="btn btn-sm btn-default" ng-click="toggleMin()" tooltip="After today restriction">Min date</button>
            </div>
        </div>

正如您所看到的，我唯一改变的是删除内联和其他弹出选项，因为我不需要它们。我已经将模型从dt更改为items.DueDate。

任何对此的帮助都会很棒，因为我现在有点难过。

Answer 1

好的家伙我找到了答案。在bootstrap ui angular controller中，明天和明天之后会有一些变量通过注释掉整个代码块来解决问题。

我不确定为什么这些在那里但是移除它们没有造成任何错误或功能中断，所以我很乐意在没有它们的情况下继续战斗。

tl：dr我注释掉了以下代码。

var tomorrow = new Date();
    tomorrow.setDate(tomorrow.getDate() + 1);
    var afterTomorrow = new Date();
    afterTomorrow.setDate(tomorrow.getDate() + 2);
    $scope.events =
      [
        {
            date: tomorrow,
            status: 'full'
        },
        {
            date: afterTomorrow,
            status: 'partially'
        }
      ];

Answer 2

我找到了办法。首先将该日期转换为字符串。这是代码。

 var SelectDate = $scope.GetFormattedDate(Date.parse($("#Date").datepicker("getDate")));            
     $scope.GetFormattedDate = function (CalDate) {
            var re = /-?\d+/;
            var WDate = CalDate.toString();
            var m = re.exec(WDate);
            var lastDate = new Date(parseInt(m[0]));
            var mm = lastDate.getMonth() + 1;
            var dd = lastDate.getDate();
            var yyyy = lastDate.getFullYear();
            var formattedDate = mm + '/' + dd + '/' + yyyy;

            return formattedDate;
        }

现在将SelectDate传递给您的控制器。宾果问题已经解决：）

AngularJS Datepicker将日期设置为比所选日期提前1天

2 个答案: