在 angular 日期选择器中设置当前日期和默认时间

Question

I want to set the default date to current date and customize default time in a datepicker using Angular, eg Current date: 07-02-2020 and default custom time should be 08:00 AM. How can i achieve this please. Here is my html code which only shows date and time based on value selected.

   <label class="col-sm-12 col-md-8 form-control-label  ml-2" for="date_from">{{'From Date' | 
  translate}} <span class="danger">*</span>:</label>
                <div class="col-md-12">
                    <input type="datetime-local" [(ngModel)]="leaveList.date_from" 
  [max]="leaveList.date_to" class="form-control input-md" id="date_from" 
                    name="date_from" (change)="onChangeDate()"  max="9999-12-31">
                </div>

.component.ts file

Answer 1

You need to use moment library for date/time formatting

1-install moment using npm i moment

2-You have to assign value to date_from in your .ts , just like that

leaveList.date_from = moment().format('MM-DD-YYYY 8:30A')

Answer 2

<input required class="form-control" [(ngModel)]="myDate" type="datetime-local" name="myDate" id="myDate"/>

you can customize the date as you want instead of using new Date()

this.myDate = this.datepipe.transform(new Date(), 'yyyy-MM-ddThh:mm'),

so you have to import DatePipe

import {DatePipe} from '@angular/common'

and initialize in the constructor

constructor(public datepipe: DatePipe){
}

and also add it int the app.module.ts as a provider

providers: [
    DatePipe,
    ....
],

read more https://angular.io/api/common/DatePipe