Angular-Material DateTime Picker Component?

angular datepicker angular-material2 datetimepicker timepicker
Kevin Curnow picture Kevin Curnow · Feb 6, 2018 · Viewed 91k times · Source

I imported a date picker in a project and was wondering if there was any official recent component from angular and material to include time in the calendar as well.
I've seen plenty of time pickers in material documentation and researched a lot of third party ones, but they seem very complex.

Answer

Maurice picture Maurice · Feb 26, 2019

You can have a datetime picker when using matInput with type datetime-local like so:

  <mat-form-field>
    <input matInput type="datetime-local" placeholder="start date">
  </mat-form-field>

You can click on each part of the placeholder to set the day, month, year, hours,minutes and whether its AM or PM.

Related questions

angular material 2, change datepicker Date Format "MM/DD/YYYY" to "DD/MM/YYYY" strange behavior

I just tried to change the angular material 2 date-picker default Date Format MM/DD/YYYY to DD/MM/YYYY or DD.MM.YYYY or at least DD-MM-YYYY According to this question and as mentioned in the documentation providers: [{provide: MD_…

Read More
How to pick date range in angular material 5.0.0 with datepicker?

I am using the latest Angular Material 5.0.0-rc0 in my Angular 5 app. I am trying to select a range of dates with the datepicker provided with Angular material, but I couldn't find any documentation regarding that. All I could work …

Read More
day incorrect in angular material datepicker

When I select a date I see the correct date in the field but, when I save, the datepicker send the day before the date I have selected ( 3 hours offset ) i am using angular reactive form and MatMomentDateModule for date …

Read More