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

angular npm datepicker calendar dayofmonth
D.Sridhar picture D.Sridhar · Jun 20, 2018 · Viewed 17.9k times · Source

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">

Answer

maury844 picture maury844 · Jun 20, 2018

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".

Related questions

Checking version of angular-cli that's installed?

Is there a way to check the specific version of angular-cli that's installed globally on my machine? I'm in a Windows environment. *npm -v* and *node -v* only gives me the version of npm and node respectively, and I can't …

Read More
NPM Install Error:Unexpected end of JSON input while parsing near '...nt-webpack-plugin":"0'

When Creating a new Angular 5 project: node version: 8.9.2 npm version: 5.5.1 My Command is npm install -g @angular/cli the Error is npm ERR! **Unexpected end of JSON input while parsing near '...nt-webpack-plugin":"0'** npm ERR! A complete log of …

Read More
npm WARN ... requires a peer of ... but none is installed. You must install peer dependencies yourself

I tried to run a project downloaded from github. Unfortunately, during npm install the following warnings were shown. I tried to change the version based on this question. However, I had a problem, because some packages require multiple versions other …

Read More