Angular setting input type="date" at start at actual date-CodePudding

I have the following code and i want to get the input to start with the the actual date

<div >
      <label  for="enroll"><b>User Enrollement Date</b></label>
      <input type="date"  id="date" name="date" required [form-control]="EnrollmentDate"/>
</div>

in component.ts i have the following:

export class AppComponent {
  EnrollementDate = new FormControl(new Date());

How i can start the date input like this: instead of this: ?

CodePudding user response：

I think you want to bind the formControl to a formControl and not to a ngModel

<div >
      <label  for="enroll"><b>User Enrollement Date</b></label>
      <input type="date"  id="date" name="date" required [formControl]="EnrollmentDate"/>
</div>

Also the input is always working with string so you have also to do it like that:

EnrollmentDate = new FormControl(new Date().toISOString().substr(0, 10));

Demo: https://stackblitz.com/edit/angular-qdstvv?file=src/app/app.component.ts

CodePudding user response：

let dateValue = 'Jun 15, 2015, 21:43:11 UTC'; // UTC format works best

EnrollementDate = new FormControl(new Date(dateValue));

The above should work, if you want to set it during OnInit lifecycle hook:

ngOnInit() {
    this.EnrollementDate.setValue(dateValue or new Date(dateValue));
}