在Angularjs日期选择器中禁用特定日期

Question

我想在AngularJS的日期选择器中禁用特定的日期。

我正在使用AngularJS-bootstrap css作为组件。

我想要禁用的日期将根据组合体中先前值的选择动态更改。

我认为date-disabled="disabled(date, mode)"应该能起作用，尽管还不确定。

，我该怎么做?

Answer 1

我假设您使用的是角用户界面中的Datepicker指令。date-disabled属性允许禁用某些日期(例如周末)。请看下面的http://plnkr.co/edit/gGAU0L?p=preview

如果要根据选择动态禁用日期，可以使用min和max属性和观察者。请参阅http://plnkr.co/edit/W5pb1boMLOHZFnWkMU8o?p=preview

参考文献：

http://angular-ui.github.io/bootstrap/#/datepicker

Answer 2

注意，到目前为止，在AngularUI引导程序的更新版本(从1.1.0开始)中，您必须使用datepicker-options属性来禁用date以及max/min date。

在html控件中，添加

datepicker-options="vm.dateOptions"

或者datepicker-options="dateOptions"，如果您不是使用controller as，而是直接使用$scope。

然后在控制器中定义dateOptions对象。

    vm.dateOptions = {
        maxDate: new Date(),
        dateDisabled: myDisabledDates
    };  

    function myDisabledDates(dateAndMode) {
        return ( dateAndMode.mode === 'day' && ( dateAndMode.date.getDay() === 0 || dateAndMode.date.getDay() === 6 ) );
    }

注意！更改了的函数dateDisabled签名。以前，它接受日期对象和模式字符串。在较新的版本中，它是一个包含两者的包装对象。