Angular 4 Date-Picker - How to restrict Future and Past Days

Question

I want to restrict the future and past days using Angular 4 Date-Picker.I just want to enable Current Date[today] only.How can i solve this.

Can anyone have idea...???

This is my template:

<input type="text" placeholder="FromDate" class="form-control" 
  placement="top"
  formControlName="fromDate" 
  [bsConfig]="{ dateInputFormat: 'DD-MM-YYYY' }" 
  bsDatepicker style="padding: 16px">

It depends on how you have implemented your date-picker. Can you post your date-picker code please? — rmcsharry, Jun 20 '18 at 12:21

score 7 · Accepted Answer · answered Jun 20 '18 at 12:59

7

bsDatepicker has a property [minDate] and [maxDate], so you set those to "today" and inside your components constructor you do:

component.ts

today=new Date();

component.html

<input ... bsDatepicker ... [minDate]="today" [maxDate]="today" ... >

Anyway, having a datepicker when you don't really allow the user to select a date other than today makes no sense, you might as well default it to "today".

answered Jun 20 '18 at 12:59

maury844

1,210
15
25

If this answered your question make sure to mark it as accepted or upvote so it can help other people with the same issue. Thanks! – maury844 Jun 20 '18 at 13:49
how to tranform that DATE-FORMAT from "DD-MM-YYYY" into "YYYY-MM-DD" while clicks on submit... my template should be "params.Date = this.LicenseForm.value.Date" – D.Sridhar Jun 21 '18 at 06:07

score 0 · Answer 2 · edited Jul 23 '21 at 12:38

0

Similar than mentioned above, but in angular according to: https://material.angular.io/components/datepicker/api

component.ts

today = new Date()

component.html

<input matInput [min]="today" [max]="today">

edited Jul 23 '21 at 12:38

Josef

2,869
2
22
23

answered Jul 23 '21 at 06:16

etlapa

31
3

Angular 4 Date-Picker - How to restrict Future and Past Days

2 Answers2

Linked