使用angular-bootstrap-datetimepicker禁用将来的日期 [英] Disable future dates using angular-bootstrap-datetimepicker

问题描述

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

I'm building a website in which the user has the ability to see some charts. Those charts are date-specific so the user needs to select the date for the chart to show up.

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

Everything is working, but the user is allowed to select future dates. This shouldn't happen, because the charts are only for present and past dates.

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

For the project I'm using Angular5 and for the date picker angular-bootstrap-datetimepicker and I can't seem to find the way to disable those date.

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

The way I'm using the library to show the datepicker is something like this:

<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 .:我已经研究过旧的问题/答案，因为它们适用于库的所有版本，所以它们不起作用.

P.S.: I've already looked at old questions/answers and they do not work because those are for all versions of the library.

推荐答案

我在图书馆的文档.

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

There's an attribute called "selectFilter" that can be bound to a function, so the use would be something like this:

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

可以根据每个项目的特定要求重新定义此功能:).

This function can be redefined following the specific requirements of each project :).

这篇关于使用angular-bootstrap-datetimepicker禁用将来的日期的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！