Question

我的日期选择工具无法正常工作。

HTML

<div datepicker-config class="datepicker input-group">
    {{ dateOffer }}
    <input type="text" class="form-control" datepicker-popup="{{ format }}" name="dateOffer" ng-model="dateOffer" is-open="opened" min-date="minDate" datepicker-options="dateOptions" ng-required="true" ng-readonly="true" />
    <span class="input-group-btn">
        <button type="button" class="btn btn-default" ng-click="open($event)" tabindex="-1"><i class="glyphicon glyphicon-calendar"></i></button>
    </span>
</div>

如果我通过选择设置日期，我会在输入框中获得正确的值

20.07.2015 (this is dd.mm.yyyy)

通过查看表达式{{dateOffer}}我看到了

"2015-07-20T12:54:43.898Z"

也没关系。

但是当我发布数据并通过console.log($scope.dateOffer)查看数据时，值为

Tue Jul 28 2015 14:54:43 GMT+0200 (CEST)

这很奇怪。请记住，在加载页面时，我正在设置$scope.dateOffer = new Date();

CONTROLLER

$scope.dateOffer = new Date();

CONFIG

angular
    .module('offerCreateUpdate')
    .directive('datepickerConfig', function() {
        return {
            restrict: 'A',
            scope: true,
            controller: function($scope, datepickerPopupConfig) {
                datepickerPopupConfig.closeText = 'Some text';
                datepickerPopupConfig.clearText = 'Some text';
                datepickerPopupConfig.currentText = 'Some text';
                datepickerPopupConfig.datepickerPopup = 'dd.MM.yyyy';

                $scope.today = function() {
                    $scope.dt = new Date();
                };
                $scope.today();

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

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

                var today = new Date();
                $scope.minDate = today.setDate(today.getDate() - 30);

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

                    $scope.opened = true;
                };

                $scope.dateOptions = {
                    startingDay: 1,
                    showWeeks: false
                };

                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 '';
                };
            }
        }
    });

Answer 1

一切正常，你的理解是错误的

输入字段有一些格式化结果，因为Angular UI会将您的日期值更改为某种正确的格式。

表达式也将具有格式化值，因为它由角度本身处理。

但是当你执行console.log（date）时，它会打印date.toString（）。所以无论你在console.log中获得什么，都只是你日期对象的toString。

AngularJS Bootstrap UI datepicker问题

1 个答案: