Angular 2 bootstrap datepicker禁用其他日期不起作用答案

【问题标题】：Angular 2 boostrap datepicker disable other dates not workingAngular 2 bootstrap datepicker禁用其他日期不起作用
【发布时间】：2018-07-03 22:41:17
【问题描述】：

我目前正在使用示例https://ng-bootstrap.github.io/#/components/datepicker/examples中的角度引导日期选择器（基本日期选择器）

我的问题是我如何禁用除了我设置的选定日期之外的其他日期？示例：选择了 7 月 13 日，其他日期全部禁用。

感谢并期待！

【问题讨论】：

标签： angular datepicker ng-bootstrap

【解决方案1】：

我不知道这是否正是您所需要的，但它可能会让您走上正轨：您可以通过修改您引用的页面底部的全局配置示例来将日期限制为特定日期

import {Component} from '@angular/core';
import {NgbDatepickerConfig, NgbDateStruct} from '@ng-bootstrap/ng-bootstrap';

@Component({
  selector: 'ngbd-datepicker-config',
  templateUrl: 'src/datepicker-config.html',
  providers: [NgbDatepickerConfig] // add NgbDatepickerConfig to the component 
providers
})
export class NgbdDatepickerConfig {

  model;

  constructor(config: NgbDatepickerConfig) {
    // customize default values of datepickers used by this component tree
    config.minDate = {year: 1900, month: 1, day: 1};
    config.maxDate = {year: 2099, month: 12, day: 31};

    // days that don't belong to current month are not visible
    config.outsideDays = 'hidden';

    // everyday but today is disabled
    config.markDisabled = (date: NgbDateStruct) => {
      const today = new Date();
      today.setHours(0,0,0,0);
      const d = new Date(date.year, date.month - 1, date.day);
      return d.getTime() !== today.getTime();
    };
  }
}

希望对你有帮助

【讨论】：

感谢您的回复，非常感谢。但这仅适用于当前日期。如果对于预定义的日期或仅像 [14, 15, 16] 和其他日期被禁用的多个日期怎么办。希望得到您的反馈。谢谢
我只是在 config.markdisabled 函数中添加了不同的逻辑，因此不是检查今天的日期 (return d.getTime() !== today.getTime();)，而是检查我感兴趣的日期/日期，例如return d.getTime() !== myDateVariable.getTime();
对不起，它仍然不起作用，我尝试了类似if (d.getDate() != 4 || d.getDate() != 5 || d.getDate() != 6) { return true; } 的方法，但它禁用了所有日期。你能举一个实际的例子吗？谢谢
您不能将日期与4、5 或6 等数字进行比较 - 您需要比较日期。比较日期的一种方法（我认为最简单的方法）是使用 getTime() 函数，它以毫秒为单位返回日期（阅读更多here）——因此，您可以举一个比较 7 月 5 日的示例是：var myDate = new Date(2018, 07, 05);return d.getTime() !== myDate.getTime();