search

angular / components

Component infrastructure and Material Design components for Angular
https://material.angular.io
MIT License
24.35k stars 6.74k forks source link

Hide "dd.mm.yyyy" on form-field with empty date-input #15742

Open wottpal opened 5 years ago

wottpal commented 5 years ago

What is the expected behavior?

Date-Input behaves like all other form-fields when the value is empty and the label is used as its placeholder. When clicked inside the field the format-placeholder should be shown.

What is the current behavior?

Even without any value (or clicking inside it) the form-field label is floating above the input-field and it shows the local format-placeholder 'dd.mm.yyyy'.

What are the steps to reproduce?

https://stackblitz.com/edit/angular-material-form-date-behavior

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

not sure

jonathanRinciari commented 5 years ago

A fairly simple work around would be something like this. It isn't perfect but gets the job done

  <input
     #dateInput matInput
      aria-label="Date Input"
     (focus)="dateInput.type = 'date'
     (blur)="dateInput.type = 'text""
   ></input>
andrei-varchanka commented 4 years ago

@jonathanRinciari it is not working on iOS - we can't enter values at all https://stackblitz.com/edit/angular-5ydksc