Angular Material datepicker format for specific input

Question

How can I control the format of input for a datepicker individually, without changing format for the whole module?

<input matInput [matDatepicker]="dp" [formControl]="date" [format]="'DD/MM/YYYY'"> <-- is this possible?
<mat-datepicker-toggle matSuffix [for]="dp"></mat-datepicker-toggle>
<mat-datepicker #dp></mat-datepicker>

you can change the DateAdapter for one component, e.g. stackoverflow.com/questions/54113765/…. But I'm not prety sure how do if you has two datePicker in the same component — Eliseo
– Eliseo, Commented Jun 7, 2020 at 10:31

Captain Winters · Accepted Answer · 2020-06-07 09:50:17Z

0

Yes, you have to change locale of date-picker to en-GB by adding {provide: MAT_DATE_LOCALE, useValue: 'en-GB'} to provider section of you module. Like below

@NgModule({providers: [{provide: MAT_DATE_LOCALE, useValue: 'en-GB'}]})

Official doc for this

edited Jun 7, 2020 at 9:50

answered Jun 7, 2020 at 9:45

Captain Winters

681 silver badge8 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Jango Over a year ago

I want to format multiple inputs within the same module differently. If I do what you suggest, then every datepicker input will have the same format. What I asked is whether it is possible to format datepicker inputs individually.

Collectives™ on Stack Overflow

Angular Material datepicker format for specific input

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related