when I write a date like 24.12.1997 what is the german format of date dd.MM.yyyy the validation will fail because it's not a right date for him. For example when I write 03.12.1997 he will change it after I leave the field to 12.03.1997 because something does not seem to be right.

When I pick with the datePicker itself it works fine and I get the right date in german format. Also the question is there a way to adjust the datePicker to the current used language because I use i18n for everything with German and English and it would be strange otherwise.

app.module.ts

 providers: [
    { provide: MAT_DATE_LOCALE, useValue: 'de-DE' },
    { provide: MAT_MOMENT_DATE_ADAPTER_OPTIONS, useValue: { useUtc: true } },

html:

    <mat-form-field class="field-sizing">
      <input matInput required [matDatepickerFilter]="dateOfBirthFilter" [matDatepicker]="dateOfBirth"
        placeholder="{{ 'REGISTRATION.DATEOFBIRTH' | translate }}" name="dateOfBirth"
        formControlName="dateOfBirth"
        [ngClass]="{ 'is-invalid': g.dateOfBirth.touched && g.dateOfBirth.errors }" />
      <mat-datepicker-toggle matSuffix [for]="dateOfBirth"></mat-datepicker-toggle>
      <mat-datepicker #dateOfBirth startView="multi-year" [startAt]="startDate"></mat-datepicker>
      <mat-error class="invalid-feedback"
        *ngIf="g.dateOfBirth.touched && g.dateOfBirth.errors && g.dateOfBirth.errors.required">
        {{ 'REGISTRATION.DATEOFBIRTH' | translate }} {{ 'VALIDATION.REQUIRED' | translate }}
      </mat-error>
    </mat-form-field>

The .TS is unnecessary because there are only settings for the filter.

enter image description here

enter image description here

0 Answers