Below is the code I am using to set the minDate
<input ngbDatepicker #d="ngbDatepicker" [minDate]="minDate" [formControl]="Form.controls['dateOfBirth']">
In the component I am setting the minDate as below:
public minDate: Date = void 0;
constructor() {
this.minDate = new Date(1950, 1, 1);
}
But the datepicker still shows 2007 as the minDate. Is there any thing that is missing. Let me know in case any other information is required.
Thanks for your time.
From your code snippet it looks like you are using ng-bootstrap from https://ng-bootstrap.github.io/#/components/datepicker. Assuming that I'm correct you need to use NgbDateStruct (an object with fields like year, month, day) instead of the built-in JavaScript Date object. For example, to set a min date to the beginning of this year you would use:
this.minDate = {year: 2017, month: 1, day: 1};
Here is a working example in a plunker: http://plnkr.co/edit/VDEYDwp7QIZDDHatCNPh?p=preview
Just pass [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"/>
This is your HTML Code
<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>
This goes to typescript:
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(),
};