当前位置:  开发笔记 > 编程语言 > 正文

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

如何解决《禁用Angularjs日期选择器中的特定日期》经验,为你挑选了2个好方法。

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

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

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

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

我怎样才能做到这一点 ?



1> Farhan Khan..:

我假设你正在使用DatepickerAngular-UI 的指令.该date-disabled属性允许您禁用某些日期(例如,周末).请参阅此插件http://plnkr.co/edit/gGAU0L?p=preview

如果要根据选择动态禁用日期,可以使用minmax属性和观察者.见http://plnkr.co/edit/W5pb1boMLOHZFnWkMU8o?p=preview


参考文献:

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



2> LeOn - Han L..:

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

推荐阅读
喜生-Da
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有