Angular 2 bootstrap datepicker 禁用其他不工作的日期

Question

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

我的问题是如何禁用我设置的所选日期以外的其他日期？例：选择7月13日，其他日期全部禁用

感谢并期待！

Answer 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();
    };
  }
}

希望对您有所帮助

Angular 2 bootstrap datepicker 禁用其他不工作的日期

Angular 2 boostrap datepicker disable other dates not working

datepicker

ng-bootstrap

angular