Jarmila
Jarmila

Reputation: 1

I need some help to write nested ngFor loops in Angular

I need some help to write nested ngFor loops in Angular. Need to have always 3 same answers(radio buttons) for a loop of questions (checkboxes).

My code:

<ng-container *ngFor="let daType of daTypes"> 
 <mat-checkbox [name]="daType" [(ngModel)]="data[daType]">{{some string interpolation}}</mat-checkbox>
 <mat-radio-group id="daTAs" name="daTAs" [(ngModel)]="data[daType]">
   <ng-container *ngFor="let daTA of ansYNU">
     <mat-radio-button [value]="daTA"> {{some string interpolation}} </mat-radio-button>
   </ng-container>
 </mat-radio-group>
</ng-container>

daTypes and ansYNU are both arrays of strings.

By writing it like this all radio buttons act like one - if I check "yes" in the first question, and then "no" in second, the first "yes" doesn't stay checked.

Can someone see where the problem is?

Upvotes: 0

Views: 187

Answers (1)

Christian G&#225;lvez
Christian G&#225;lvez

Reputation: 183

As a rule, all radio groups should have a unique "name" attribute. In this case, in each iteration you are render a radio group with same "name" attribute value.

I advise you assign them with different "name" attribute value each one.

Upvotes: 1

Related Questions