Question

我有以下代码片段，其中有datepicker控件。

<input type="text" name="startDate" class="form-control  input-sm" datepicker-popup="dd-MMMM-yyyy" ng-model="startDate" required />

在这里，我必须在datepicker控件中禁用过去的日期，下面是我已经配置但它无法正常工作。我在这里错过了什么吗？

App.config(['datepickerConfig', 'datepickerPopupConfig', function (datepickerConfig, datepickerPopupConfig) {
    datepickerConfig.startingDay = 1;
    datepickerConfig.showWeeks = true;

    datepickerPopupConfig.datepickerPopup = "dd-MMMM-yyyy";
    datepickerPopupConfig.currentText = "Now";
    datepickerPopupConfig.clearText = "Erase";
    datepickerPopupConfig.closeText = "Close";
}]);

Answer 1

如果您想缩小可能日期的范围，请添加min-date或max-date just as in the example。

这是相关的part of documentation：

max-date（默认值：null） - 定义最大可用日期。

min-date（默认值：null） - 定义最短可用日期。

Answer 2

由于角度ui-bootstrap版本1.1.0，您需要使用名为 datepicker-options 的属性来配置日期选择器：

<input type="text" class="form-control" datepicker-options="dateOptions" datepicker-popup="dd-MMMM-yyyy" is-open="popup.opened"/>
<span class="input-group-btn">
    <button type="button" class="btn btn-default" ng-click="open()">
        <i class="glyphicon glyphicon-calendar"></i>
    </button>
</span>

现在，您只需将minDate属性设置为当前日期或您希望成为datepicker的最小日期的任何其他日期。您应该将它写在控制器或服务中，而不是在应用程序的.config块中编写datepicker配置：

$scope.dateOptions = {
   minDate: new Date() 
};

$scope.popup = {
   opened: false
};

$scope.open = function() {
   $scope.popup.opened = true;
};

有关详细信息，请阅读official documentation。

在datepicker-popup中禁用过去的日期

2 个答案: