How to change MatDatepicker format dynamically?

Viewed 114

I have matDatePicker. On button click i want to change hour format from 24h to 12h and vice versa. I know only one way to do it, { provide: NGX_MAT_DATE_FORMATS, useValue: CUSTOM_DATE_FORMATS} But if i do it, i won't be able to change format dynamically.

<input matInput formControlName="from" [ngxMatDatetimePicker]="pickerFrom" />
                    <mat-datepicker-toggle matSuffix [for]="$any(pickerFrom)"></mat-datepicker-toggle>
                    <ngx-mat-datetime-picker
                        #pickerFrom
                        [showSpinners]="true"
                        [showSeconds]="false"
                        [stepHour]="1"
                        [stepMinute]="1"
                        [stepSecond]="1"
                        [touchUi]="false"
                        [enableMeridian]="false"
                        [disableMinute]="false"
                        [hideTime]="false"
                    >
                    </ngx-mat-datetime-picker>

TS:

@Inject(MAT_DIALOG_DATA) public data: DialogData,
initForm(): void {
        this.createForm = this.formBuilder.group({
            title: [this.title],
            from: this.data.localTimeFrom,
            to: this.data.localTimeTo,
            description: [this.description],
        });
    }
0 Answers
Related