Angular JS UI启动日期选择器:最大日期和初始日期问题

Angular JS UI Bootstrap Datepicker: max-date and init date issue

本文关键字：日期 问题 JS UI 启动 选择器 Angular      更新时间：2023-09-26

我度过了多么美好的一天。。。无论如何，我一直在协助一些同事进行AngularJS项目，但无论如何，有太多错误。。。我使用的是AngularJS UI Bootstrap Datepicker版本0.11.2和AngularJS版本1.3。到目前为止，一切都很好，但我希望将最短日期设置为从当天起2个月，最长日期设置为自当天起6个月，初始日期设置为距当天起2月。这就是我目前所拥有的：

查看

<div data-datepicker
     data-ng-model="dt"
     data-min-date="minDate"
     data-max-date="maxDate"
     data-max-mode="day"
     data-show-weeks="false"
     data-starting-day="1"
     data-year-range="2"
     class="custom-date-picker"></div>

在我的控制器里。。。

 var today = new Date(),
    twoMonth = today.setMonth(today.getMonth() + 2),
    sixMonth = today.setMonth(today.getMonth() + 6);
$scope.today = function() {
    $scope.minDate = twoMonth;
    $scope.maxDate = sixMonth;
};
$scope.today();

这都是发现的，但我注意到minDate是正确的，maxDate实际上是未来8个月，当我在指令中添加以下内容以设置初始日期时（注意data-init-date="minDate"）

<div data-datepicker
     data-ng-model="dt"
     data-init-date="minDate"
     data-min-date="minDate"
     data-max-date="maxDate"
     data-max-mode="day"
     data-show-weeks="false"
     data-starting-day="1"
     data-year-range="2"
     class="custom-date-picker"></div>

我得到以下错误！

TypeError: undefined is not a function
at e._refreshView (js/vendor/angular/ng-ui-bootstrap-tpls-0.11.2.min.js:8:16705)
at refreshView (js/vendor/angular/ng-ui-bootstrap-tpls-0.11.2.min.js:8:13968)
at link (js/vendor/angular/ng-ui-bootstrap-tpls-0.11.2.min.js:8:17848)
at B (js/vendor/angular/angular-1.3.0-beta.18.min.js:55:369)
at js/vendor/angular/angular-1.3.0-beta.18.min.js:62:378
at g (js/vendor/angular/angular-1.3.0-beta.18.min.js:48:105)
at js/vendor/angular/angular-1.3.0-beta.18.min.js:47:233
at js/vendor/angular/angular-1.3.0-beta.18.min.js:49:54
at Object.r [as transclude] (js/vendor/angular/angular-1.3.0-beta.18.min.js:52:497)
at js/vendor/angular/angular-1.3.0-beta.18.min.js:215:316 <table role="grid" aria-labelledby="{{uniqueId}}-title" aria-activedescendant="{{activeDateId}}" ng-switch-when="day" tabindex="0">

有人知道我哪里错了吗？

需要注意的是，您的日期在这里发生了变化：

var today = new Date(),
    twoMonth = today.setMonth(today.getMonth() + 2),
    sixMonth = today.setMonth(today.getMonth() + 6);

每个setMonth调整原始日期。因此，八个月的问题。

后一个问题是由twoMonth和sixMonth是数字这一事实引起的。我认为你的指令需要日期，所以用new Date(...)包装它们。

解决方案

我认为应该这样做：

var twoMonth = offsetMonths(2);
var sixMonth = offsetMonths(6);
function offsetMonths(offset) {
    var ret = new Date();
    ret.setMonth(ret.getMonth() + offset);
    return new Date(ret);
}

当然，你可以通过使用moment.js.

这样的东西来简化很多事情
相关文章：