Question

我正在建立一个网站，用户可以在其中查看一些图表。这些图表是特定于日期的，因此用户需要选择图表显示的日期。

一切正常，但允许用户选择将来的日期。这不应该发生，因为图表仅用于当前和过去的日期。

对于我正在使用Angular5的项目以及日期选择器angular-bootstrap-datetimepicker，我似乎找不到禁用这些日期的方法。

我使用库显示日期选择器的方式是这样的：

<dl-date-time-picker      
   [startView]="'day'" 
   [minView]="'day'" [maxView]="'year'" 
   [ngModel]="item.entity" 
   (click)="$event.stopPropagation()" 
   (ngModelChange)="onDateChange(filter, item, $event, dd)"> 
</dl-date-time-picker>

有人知道怎么做吗？

P.S .：我已经研究过旧的问题/答案，因为它们适用于库的所有版本，所以它们不起作用。

Answer 1

我在图书馆的documentation上找到了解决方案。

有一个名为“ selectFilter”的属性可以绑定到一个函数，因此使用方法如下：

<dl-date-time-picker
  [selectFilter]="selectFilter"
  [ngModel]="item.entity"           
  (click)="$event.stopPropagation()"
  (ngModelChange)="onDateChange(filter, item, $event, dd)">
</dl-date-time-picker>

然后可以这样定义 selectFilter ：

private selectFilter(dateButton: DateButton, viewName: string): boolean {
   return dateButton.value <= (new Date()).getTime();
}

可以根据每个项目的特定要求重新定义此功能：）。

使用angular-bootstrap-datetimepicker禁用将来的日期

1 个答案: