CODEWITHSUNDEEP
angularangular-materialdatetimepicker
Vishaal Kathiriya
Vishaal Kathiriya

Reputation: 45

ngModel values not reflecting with manual input and custom format for @angular-material-components/datetime-picker

I'm using @angular-material-components/datetime-picker library for datetime, date, and time picker in my Angular application. There I need to provide a custom format with manual input but somehow if I do so, ngModel value is not updating with manual change in values of this control.

Example:

<div class="input-group">
                          <input #StartDate="ngModel" [ngxMatDatetimePicker]="StartDatepicker" required
                                 [min]="minDate"
                                 [max]="(detailData.DueDate) ? detailData.DueDate : null"
                                 class="form-control" placeholder="{{'Action.Start Date'|translate}}"
                                 [(ngModel)]="detailData.StartDate" name="StartDate" id="StartDate" tabindex="7" autocomplete="off">
                          <mat-datepicker-toggle matSuffix [for]="StartDatepicker"></mat-datepicker-toggle>
                          <ngx-mat-datetime-picker #StartDatepicker [showSpinners]="true"
                                                   [stepHour]="1" [stepMinute]="1" [touchUi]="true"
                                                   [enableMeridian]="false" [hideTime]="false">
                          </ngx-mat-datetime-picker>
                        </div>

Angular version: 8.1.1

Upvotes: 0

Views: 809

Answers (1)

mike
mike

Reputation: 1863

On your ngx-mat-datetime-picker add an ngModel that you can then display or use in your component :)

ALSO THE PACKAGE IS DEPRECATED

Package no longer supported. Use @angular-material-components/datetime-picker instead, see https://www.npmjs.com/package/@angular-material-components/datetime-picker

Upvotes: 0

Related Questions