<ion-datetime displayFormat="MM"> does not bind to FormGroup
See original GitHub issueIonic version: (check one with “x”) [X ] 2.x
I’m submitting a … (check one with “x”) [ X] bug report
Current behavior: datetime does not bind to FormGroup if the format is “MM”.
Expected behavior: Bind data to FormGroup.
Steps to reproduce: Create FormGroup and try to bind datetime with the format “MM”.
Related code:
this.cardForm = this.formBuilder.group({ 'name': ['', Validators.required], 'number': ['', Validators.required], 'exp_month': ['', Validators.required], 'exp_year': ['', Validators.required], 'cvc': ['', Validators.required] });
<form [formGroup]="cardForm" (ngSubmit)="requestToken($event)"> <ion-item> <ion-input formControlName="name" placeholder="Card Holder Name" type="text"></ion-input> </ion-item> <ion-item> <ion-input formControlName="number" placeholder="Card Number" size="16" maxlength="16" type="number"></ion-input> </ion-item> <ion-item> <ion-datetime formControlName="exp_month" displayFormat="MM" pickerFormat="MM"></ion-datetime> </ion-item> <ion-item> <ion-datetime formControlName="exp_year" displayFormat="YYYY" max="2050-10-31"></ion-datetime> </ion-item> <ion-item> <ion-input formControlName="cvc" placeholder="cvc" maxlength="3" size="3" type="number"></ion-input> </ion-item> <button block ion-button type="submit">Create</button> </form>
The output when I console.log(this.cardForm.value):
The MM does not appear in exp_month whereas the YYYY appears in exp_year
Cordova CLI: 6.4.0 Ionic Framework Version: 2.0.0-rc.3 Ionic CLI Version: 2.1.12 Ionic App Lib Version: 2.1.7 Ionic App Scripts Version: 0.0.43 ios-deploy version: 1.9.0 ios-sim version: 5.0.6 OS: macOS Sierra Node Version: v4.0.0 Xcode version: Xcode 8.1 Build version 8B62
Issue Analytics
- State:
- Created 7 years ago
- Comments:5
Another workaround is use a hour format:
displayFormat="hh"
(visually is the same than month). And after take a substring like this:month.substring(0,2)
A fix for now is to use
ionChange
grab the event and then:this.form.patchValue({ desbaste: event.minute.value });