0

How do I make this datetime picker, not display seconds? And Only show Date, Hours, and Minutes?

Currently it has seconds below,

  <mat-form-field appearance="outline" floatLabel="always">
    <mat-label>Start Date</mat-label>
    <input 
      matInput
      type="datetime-local" 
      placeholder="Start Date"
    >
  </mat-form-field>

I only want to use native html, https://stackoverflow.com/a/54889140/15293929 no npm package

enter image description here

2 Answers2

0

I think you can use the native date picker for that

Your code snippet will look like this:

<mat-form-field appearance="outline" floatLabel="always">
    <mat-label>Start Date</mat-label>
    <input 
      matInput
      type="date" // Only shows the datepicker interface
      placeholder="Start Date"
    >
  </mat-form-field>

Reference: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/date

pkumar
  • 79
  • 4
  • While this link may answer the question, it is better to include the essential parts of the answer here and provide the link for reference. Link-only answers can become invalid if the linked page changes. - [From Review](/review/low-quality-posts/28446819) – ChrisGPT was on strike Mar 03 '21 at 01:16
  • Updated my answer based on your feedback – pkumar Mar 03 '21 at 01:24
  • I pointed up your answer and gave points, feel free to thumbs up question also, thanks –  Mar 04 '21 at 19:29
0

Make sure you patch the value of date to set Seconds and Milliseconds to 0. Then the seconds menu option in datepicker will not be shown.

newDate.setSeconds(0);
newDate.setMilliseconds(0);