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

Disable specific dates in Angularjs date picker

本文关键字：日期 选择器 Angularjs 禁用      更新时间：2023-09-26

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

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

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

我相信date-disabled="disabled(date, mode)"应该有效，尽管不确定。

我该怎么做？

我假设你使用的是Angular-UI的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

请注意，截至目前，在 AngularUI Bootstrap 的较新版本（从 1.1.0 开始）中，您必须使用datepicker-options属性来禁用日期以及最大/最小日期等操作。

在 HTML 控件中，添加

datepicker-options="vm.dateOptions"

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

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

    vm.dateOptions = {
        maxDate: new Date(),
        dateDisabled: myDisabledDates
    };  
    function myDisabledDates(dateAndMode) {
        return ( dateAndMode.mode === 'day' && ( dateAndMode.date.getDay() === 0 || dateAndMode.date.getDay() === 6 ) );
    }

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

相关文章：