禁用 ng-bootstrap angular7 中以前日期的日期和时间

Question

html

     <ngb-datepicker (select)="onDateSelect($event)" [(ngModel)]="datePickerModel"></ngb-datepicker>

 <ngb-timepicker [meridian]="meridian" [(ngModel)]="time" class="fromTimePick">
                </ngb-timepicker>

如何禁用过去几天的日历日期，即禁用今天之前的天数和现在之前的时间（即禁用相对于当前日期的当前时间之前的过去时间）？

Answer 1

对于 ngb-datepicker，您可以设置 minDate 输入绑定以禁用过去的日期：

<ngb-datepicker (select)="onDateSelect($event)" [(ngModel)]="datePickerModel"[minDate]="todayDate">

并且在您的 component.ts 上，您将 todayDate 设置为今天。

const current = new Date();
this.todayDate = {
  year: current.getFullYear(),
  month: current.getMonth() + 1,
  day: current.getDate()
};

Demo

至于时间选择器，您不能使用 ng-boostrap API 显式禁用 hours/minutes 选择器，但我的建议是在时间选择器之外编写您的自定义验证以防止用户提交时间无效的表格？

禁用 ng-bootstrap angular7 中以前日期的日期和时间

disable ng-bootstrap date and time for previous dates in angular7

datetimepicker

ng-bootstrap

angular

html