Angular UI Bootstrap DatePicker initDate 问题

Question

我正在尝试在 angular bootsrap 的日期选择器指令中设置初始化日期。我收到以下错误

Error: [$parse:syntax] Syntax Error: Token 'Jun' is an unexpected token at column 5 of the expression [Sun Jun 21 2015 17:00:00 GMT-0700 (PDT)] starting at [Jun 21 2015 17:00:00 GMT-0700 (PDT)].

下面是我使用的标记

<div ng-controller="DatepickerDemoCtrl">
<h4>Popup</h4>
<div class="row">
    <div class="col-md-6">
        <p class="input-group">
            <input type="text"
                   class="form-control"
                   init-date="dateOptions.initDate"
                   datepicker-popup="{{format}}"
                   ng-model="dt"
                   is-open="opened"
                   min-date="dateOptions.minDate"
                   max-date="'2016-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>

这里是 javascript 我准备好的一面

angular.module('app', ['ui.bootstrap']);
angular.module('app').controller('DatepickerDemoCtrl', function ($scope) {
    $scope.open = function($event) {
        $event.preventDefault();
        $event.stopPropagation();

        $scope.opened = true;
    };
    $scope.dateOptions = {
        formatYear: 'yy',
        startingDay: 1,
        minDate: new Date(2015, 9, 9),
        initDate: new Date('2015-06-22')
    };
    $scope.format = ['MM-dd-yyyy'];
});

不太确定我在这里可能遗漏了什么...有人可以帮忙吗？

Answer 1

升级到最新版本 0.13 应该可以解决问题...我使用的是 0.12 版本

希望这对您有所帮助...

Answer 2

对于那些不能使用 0.13 的人：您可以将初始化日期直接分配给模型：

module.controller[...., function(....){
    //Init
    $scope.dt = new Date();
    $scope.dt.setDate($scope.dt.getDate()-7);

 }]

Answer 3

从 dateOptions 中删除 minDate、maxDate 解决了我的问题。

Answer 4

对于无法更新到 0.12 以上但必须设置最小和最大日期的用户，我找到了解决方法。我将选项放在范围内，如下所示。

诚然，它既丑陋又烦人，但通过 setDate() 重置日期是使它对我有用的唯一方法。只是分享。将此作为您的最后选择。

var minDate = new Date(2017, 3, 27);
minDate = minDate.setDate(minDate.getDate()-0);
var maxDate = new Date();
maxDate = maxDate.setDate(maxDate.getDate()-0);

$scope.dpOptions = {
    minDate: minDate,
    maxDate: maxDate
};

Answer 5

我通过将 minDate 和 maxDate 设置为毫秒解决了这个问题：

minDate: new Date().getTime()

编辑：仅当使用 minDate/maxDate 作为选项对象的属性时才需要将 Date 对象转换为毫秒。如果将它作为属性传递，它可以保留为 Date 对象。

Angular UI Bootstrap DatePicker initDate 问题

Angular UI Bootstrap DatePicker initDate Issue

datepicker

angularjs

angular-ui-bootstrap