CODEWITHSUNDEEP
angulardatepicker
Mauricio Gracia Gutierrez
Mauricio Gracia Gutierrez

Reputation: 10844

How to set minDate of a ngbDatepicker programatically using today date

I am trying to use the Today date as the minDate of a ngbDatepicker

In the component logi I have the following

export class ShareLinkFormComponent implements OnInit {

  minPickerDate = "{year: " + new Date().getFullYear() + ", month: 6, day: 27}" ;

I have used the actual month and day until I get the basic concept working

And int the template/html side I have this

<input
  class="d-none"
  name="expDate"
  ngbDatepicker
  #d="ngbDatepicker"
  [minDate]="minPickerDate" 
  [(ngModel)]="expirationDate"
  (ngModelChange)="onFromDateSelect($event)"
  style="top: 100px;"
/>

But this is not working since the date picker is showing dates in the past enabled

What am I doing wrong and can it be implemented correctly

Upvotes: 2

Views: 2140

Answers (1)

KShewengger
KShewengger

Reputation: 8269

In order to make it work you need to use an object using the structure/reference of the NgbDateStruct interface and they are all of type number not string:

minPickerDate = {
    year: new Date().getFullYear(),
    month: new Date().getMonth() + 1,
    day: new Date().getDate()
};
  • getMonth() returns from 0-11 so you need to add a one (1) to make it work
  • getDate() returns the number of the month (getDay returns the day of the week)

Upvotes: 4

Related Questions