angular / angular/components

bug(MatDatePicker): NativeDatePicker not using the correct format initially

Open
#31,107 1 comment 0 reactions 0 assignees View on GitHub
P3
Dominant language
TypeScript
Stars
25k
Forks
6.8k
Avg merge
1d 8h
Merged PRs (30d)
91

Description

### Is this a regression?

- [ ] Yes, this behavior used to work in the previous version

### The previous version in which this bug was not present was

_No response_

### Description

When I use the following setup:

```

provideNativeDateAdapter({
parse: {
dateInput: 'DD.MM.YYYY',
},
display: {
dateInput: 'DD.MM.YYYY',
monthYearLabel: 'MMM YYYY',
dateA11yLabel: 'LL',
monthYearA11yLabel: 'MMMM YYYY',
},
}),
{
provide: LOCALE_ID,
useValue: 'de-CH'
},
```

the DatePicker will show the date in the wrong format: "13.5.2025" instead of "13.05.2025". Why are the format options ignored?

### Reproduction

StackBlitz link:
Steps to reproduce:
1.
2.

### Expected Behavior

Date is formatted as "13.05.2025".

### Actual Behavior

Date is formatted as "13.5.2025".

### Environment

- Angular: 19.1.4
- CDK/Material: 19.1.5
- Browser(s): Chrome
- Operating System (e.g. Windows, macOS, Ubuntu): Windows 11

Contributor guide

Open the contributing guide

Research direction

Start with NativeDatePicker and the provideNativeDateAdapter configuration shown in the issue, using the de-CH locale and the supplied dateInput format. Reproduce the initial display and trace why the configured format is ignored; done means the picker initially displays the date as "13.05.2025".

Written by the indexing model from the issue text.

Assessment

Tech stack
angular, typescript
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.