plugins icon indicating copy to clipboard operation
plugins copied to clipboard

[@nativescript/datetimepicker] Form with date field in Angular

Open Hugo-Dlg opened this issue 3 years ago • 1 comments

Hello,

I use formGroup to do my forms in my app so I used to define my form fields with formControlName like this :

<TextField formControlName="kilometers" keyboardType="number"></TextField>

But when I put it with the datePickerField, my date variable to set the current date doesn't work anymore and it puts 1 january 1970 and when I click on the field 1 january 1900. As soon as I remove my formControlName value, it works without any issue, like if there was a conflict between date and formControlName :

<DatePickerField #date formControlName="date" [date]="dateRefuel" [pickerTitle]="'Refuel.DateTitle' | L" [maxDate]="dateRefuel"></DatePickerField>

Do you have any idea how to fix this ? The only solution that I found is to put the #date and extract the value when I click on my send form button.

Thanks

Hugo-Dlg avatar May 28 '21 14:05 Hugo-Dlg

Why are you using the [date] binding at all when you are already using formControlName? I would think the DatePickerField would get messed up with multiple sources of data. Shouldn't you be using the FormControl for everything like:

// Initial value when creating the FormGroup:
this.myFormGroup = new FormGroup({
  dateField: new FormControl(myInitialFormDate),
});

// To get current value:
const dateOnForm = this.myFormGroup.get('dateField').value;

// To set value:
this.myFormGroup.get('dateField').setValue(myDateValue);

rob4226 avatar Sep 24 '21 19:09 rob4226