Why the Radio group button not work in ionic3?

@anespa wrote:

Dear Friends,

I am working in ionic3. I try to add a Radio group button for a form. My HTML code is:

<ion-list radio-group formControlName="lgs" [(ngModel)]="data.lgs">

  <ion-list-header>
    Auto Manufacturers
  </ion-list-header>

  <ion-item>
    <ion-label>Cord</ion-label>
    <ion-radio value="cord"></ion-radio>
  </ion-item>

  <ion-item>
    <ion-label>Duesenberg</ion-label>
    <ion-radio value="duesenberg"></ion-radio>
  </ion-item>

  <ion-item>
    <ion-label>Hudson</ion-label>
    <ion-radio value="hudson"></ion-radio>
  </ion-item>

  <ion-item>
    <ion-label>Packard</ion-label>
    <ion-radio value="packard"></ion-radio>
  </ion-item>

  <ion-item>
    <ion-label>Studebaker</ion-label>
    <ion-radio value="studebaker"></ion-radio>
  </ion-item>

</ion-list>

My .ts file with respective part is

export class BirthCertificatePage {
  formgroup:FormGroup;
  username:AbstractControl;
  color:AbstractControl;
  lgs:AbstractControl;

  data:any = {};
  users: any;
  payPage : any;
  constructor(public navCtrl: NavController, public navParams: NavParams, public http: HttpClient, public formbuilder: FormBuilder, public propertyProvider: PropertyProvider ) {
     this.formgroup = formbuilder.group({
       username:['',Validators.required],
       color: ['',Validators.required]
     });
     this.username = this.formgroup.controls['username'];
     this.color = this.formgroup.controls['color'];
     this.lgs = this.formgroup.controls['lgs'];
     this.data.username = '';
     this.data.response = '';
     this.data.color = '';
     this.data.lgs = '';
     this.getUsers();
     this.payPage = PayPage;
  }

for other controls it work fine. But for this radio it show error as

Uncaught (in promise): Error: Cannot find control with name: ‘lgs’ g@http://localhost:8100/build/polyfills.js:3:7130 _throwError@http://localhost:8100/build/main.js:25309:11 setUpControl@http://localhost:8100/build/main.js:25217:9 FormGroupDirective.prototype.addControl@http://localhost:8100/build/main.js:28199:9 FormControlName.prototype._setUpControl@http://localhost:8100/build/main.js:28787:25 FormControlName.prototype.ngOnChanges@http://localhost:8100/build/main.js:28705:13 checkAndUpdateDirectiveInline@http://localhost:8100/build/main.js:11183:9 checkAndU

Please advise what I am wrong with

Thanks

Anes

Posts: 1

Participants: 1

Read full topic