如何为 ng-bootstrap datepicker 设置 minDate答案

【问题标题】：How to set minDate for ng-bootstrap datepicker如何为 ng-bootstrap datepicker 设置 minDate
【发布时间】：2017-08-20 06:35:11
【问题描述】：

下面是我用来设置 minDate 的代码

 <input ngbDatepicker #d="ngbDatepicker"  [minDate]="minDate" [formControl]="Form.controls['dateOfBirth']">

在组件中，我将 minDate 设置如下：

public minDate: Date = void 0; 
constructor() {
    this.minDate = new Date(1950, 1, 1);
}

但日期选择器仍将 2007 年显示为 minDate。有没有遗漏的东西。如果需要任何其他信息，请告诉我。

感谢您的宝贵时间。

【问题讨论】：

标签： angular datepicker ng-bootstrap

【解决方案1】：

从您的代码 sn-p 看来，您正在使用来自 https://ng-bootstrap.github.io/#/components/datepicker 的 ng-bootstrap。假设我是正确的，您需要使用 NgbDateStruct（具有 year、month、day 等字段的对象）而不是内置的 JavaScript Date 对象。例如，要将最小日期设置为今年年初，您可以使用：

this.minDate = {year: 2017, month: 1, day: 1};

这是一个 plunker 中的工作示例：http://plnkr.co/edit/VDEYDwp7QIZDDHatCNPh?p=preview

【讨论】：

【解决方案2】：

只要通过[minDate]="{year: 1980, month: 1, day: 1}":

<input type="text" [(ngModel)]="date"  ngbDatepicker #d="ngbDatepicker" (focus)="d.open()" [minDate]="{year: 1980, month: 1, day: 1}" name="date" class="form-control"/>

【讨论】：

【解决方案3】：

这是您的 HTML 代码

<mat-form-field class="col-md-3">
<mat-label >Date :</mat-label>
<input
matInput
ngxDaterangepickerMd
formControlName="dateFilter"
placeholder="Choose date"  [maxDate]="maxDate" [minDate]="minDate"
[showDropdowns]="true"
[singleDatePicker]="true"
[showCancel]="true"
 [locale]="locale"
/>
 </mat-form-field>

这是打字稿：

public minDate =  moment().subtract(1, 'days');
public maxDate = moment();
selected = moment();
locale :LocaleConfig= {
    applyLabel: 'Apply',
    customRangeLabel: ' - ',
    daysOfWeek: moment.weekdaysMin(),
    monthNames: moment.monthsShort(),
    firstDay: moment.localeData().firstDayOfWeek(),
};

【讨论】：