Question

我使用的是Datepicket，它是AngularJS ui-bootstrap模块的一部分。我按照给出的教程/示例（参见http://angular-ui.github.io/bootstrap/#/datepicker），但是当试图阻止用户选择比今天更早或超过3个月的日期时，似乎没有正常工作，因为这些仍然可以点击。

这是我认为的日期选择器...我已经写过ng-model，min-date＆amp;接口的最大日期值，以确保它们不为空）

<datepicker ng-model="dt" min-date="minDate" max-date="maxDate" show-weeks="false"></datepicker>
dt = {{ dt }}
minDate = {{ minDate }}
maxDate = {{ maxDate }}

正在返回值....

dt = "2014-04-30T15:31:46.746Z" 
minDate = "2014-05-27T15:31:46.746Z"
maxDate = "2014-08-27T15:31:46.751Z"

这是我的控制器代码...大部分取自ui-bootstrap网站上提供的示例

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

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

$scope.maxDate  = new Date(new Date().setMonth(new Date().getMonth()+3));

谁能看到我做错了什么？我无法看到我犯的错误或错误？我在OS X 10.9.2上使用Chrome 34.0.1847.137，因此浏览器兼容性不应成为问题。

Answer 1

只需在datepicker标记中分别使用 min 和 max 属性，而不是 min-date 和 max-date

<input min="p.minStartDate" max="p.maxStartDate" ng-model="p.startDate" datepicker-popup="{{'dd-MM-yyyy'}}"  datepicker-options="p.dateOptions"/>

Answer 2

您使用的是什么版本的Angular Bootstrap？我注意到我必须升级到0.11.0以获得最小和最大日期。在0.10.0中，最小和最大日期对我不起作用。我不得不使用日期禁用。

Answer 3

<input type="text" datepicker-popup="{{format}}" 
                            ng-model="dt" is-open="opened" 
                            min="'2014-09-09'" max="'2015-06-22'"
                            datepicker-options="dateOptions" 
                            date-disabled="disabled(date, mode)" 
                            ng-required="true" 
                            close-text="Close" />

对于我来说，使用angular-1.2.8版本

Answer 4

我无法使max或max-date属性生效。

相反，我发现我必须在控件上配置datepicker-options属性。 Reference here

模板

<input type="text" class="form-control" uib-datepicker-popup="d/M/yyyy" ng-model="ctrl.calendarControl.selectedDate" datepicker-options="ctrl.calendarControl.dateOptions" />

控制器

self.calendarControl = {
    dateOptions: {
        maxDate: new Date()
    }
};

Answer 5

    $(function () {
        $("[id$=txtpaymentdate]").datepicker({
            showOn: 'button',
            buttonImageOnly: true,
            format: "dd/mm/yyyy",

            todayBtn: "linked",
            language: "ru",
            autoclose: true

        });
    });

ui-bootstrap datepicker不使用最小和最大日期

5 个答案:

模板

控制器