Using dualKnob range with FormBuilder

Ionic Framework ionic-v3
1

I’m trying to use FormBuilder where one of the controllers is a range controller with dualKnobs=“true”. The problem is that all form values bound to their variables correctly, except for this range controller.

Here is my code:

export class FormPage {
  myForm: FormGroup;

constructor(private navCtrl: NavController, 
     private builder: FormBuilder,
     public alertCtrl : AlertController) {
       this.myForm = builder.group({
       'singleRange' : '',
       'doubleRange': '',
     })

onDataChange(formData) {
    console.log('Form data is ', formData);
    console.log('age ', formData['age']);
  }

The html file:

<form [formGroup]="myForm" (ngSubmit)="onSubmit(myForm.value)">
<ion-list>
		<ion-item>
		  <ion-range min="18" max="99"    secondary
		  (ionChange)="onDataChange(myForm.value)"
		  formControlName="singleRange"
		  dualKnobs="true">
		  </ion-range>
		</ion-item>

	<ion-item>
	  <ion-range min="18" max="99"    secondary
	  (ionChange)="onDataChange(myForm.value)"
	  formControlName="doubleRange"
	  dualKnobs="true">
	  </ion-range>
	</ion-item>
  </ion-list>        
</form>