angular / angular/components

feat(MatDatePicker): adding ability to use flexable format

Offen
#27,859 2 Kommentare 1 Reaktion 0 zugewiesene Personen Auf GitHub ansehen
area: material/datepicker feature P4
Vorherrschende Sprache
TypeScript
Sterne
25k
Forks
6.8k
Ø Merge
1 T. 8 Std.
Gemergte PRs (30 T.)
91

Beschreibung

### Feature Description

I'm just wondering if we can add the feature of dateFormat to the datepicker

datepicker-input-base.ts

```
@Input displayFormat: string|undefined|null;
@Input parseFormat: string|undefined|null;
```

and in the code:

```
protected _formatValue(value: D | null) {
**const format = this.displayFormat ?? this._dateFormats.display.dateInput;**
this._elementRef.nativeElement.value =
value != null ? this._dateAdapter.format(value, **format**) : '';
}

_onInput(value: string) {
const lastValueWasValid = this._lastValueValid;
**const format = this.parseFormat?? this._dateFormats.parse.dateInput;**
let date = this._dateAdapter.parse(value, **format** );
// ... remaining code
}
```

### Use Case

in this case we can alow different pasing/display format in the same app
the first input will use custom format and the second one use the default one.
both are in the same component
```

Choose a date

DD/MM/YYYY

Choose a date

MM/DD/YYYY

```

Beitragsleitfaden

Beitragsleitfaden öffnen

Rechercherichtung

Beginne in datepicker-input-base.ts und verfolge _formatValue und _onInput durch den Datumsadapter und die vorhandene date-format-Konfiguration. Definiere das in den Beispielen beschriebene Verhalten von displayFormat und parseFormat pro Eingabe, und überprüfe anschließend, dass benutzerdefinierte und Standardformate koexistieren, ohne den Standardpfad zu ändern.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Bewertung

Tech-Stack
angular, typescript
Bereich
frontend
Issue-Typ
Feature
Schwierigkeit
4/5
Geschätzter Aufwand
3-5 Tage
Aktivitätsstatus
Veraltet
Klarheit
Größtenteils klar
Anfängerfreundlichkeit
35/100

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.