4

I want my form date input field to display today's date e.g (2019-11-28) when I open the form. I saw many examples on how it works in AngularJs but how can I get the date with reactive form.

form

//.....
<div class="form-group">
  <label>Date:</label>
      <div class="input-group">
        <input type="date" class="form-control col-md-8" formControlName="date"/>
      </div>
</div>
.
//...

With formControlName.

.ts

//...
currentD = new Date();

..
..
//....

3 Answers 3

13

Set formControlName default value as (new Date()).toISOString().substring(0,10)

Working Demo

Try like this:

.ts

myForm:FormGroup;

this.myForm = new FormGroup({    
 'presentDate': new FormControl((new Date()).toISOString().substring(0,10))
});
Sign up to request clarification or add additional context in comments.

Comments

1

use data bindind you can use one way binding

<input type="date" [value]="currentD" class="form-control col-md-8" formControlName="date"/>

or tuo way binding

<input type="date" [(ngModel)]="currentD" class="form-control col-md-8" formControlName="date"/>

Comments

0

create a FormGroup variable to assign the value to Form

 form : FormGroup;

 // you can set the default value
constructor( fb:FormBuilder){
   this.form = fb.group({
      presentDate: [new Date()]
   });     
}

In the View

<div class="form-group">
 <form [formGroup] = "form">
  <label>Date:</label>
      <div class="input-group">
        <input type="date" class="form-control col-md-8" formControlName="presentDate"/>
      </div>
</div>

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.