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

Question

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

我正在使用AngularJS-bootstrapcss作为组件.

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

我相信date-disabled="disabled(date, mode)"应该工作,但不确定.

我怎样才能做到这一点 ？

Answer 1

我假设你正在使用DatepickerAngular-UI 的指令.该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 Bootstrap的较新版本(从1.1.0开始)中,您必须使用datepicker-options属性来执行日期禁用以及最大/最小日期之类的操作.

在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改变.以前它接受日期对象和模式字符串.在较新的版本中,它是包含两者的包装对象.