Pass array just what user selects - arrays

Question

I want to pass data what user checked. My problem now.. it pass all..
This is my demo code and stackblitz
HTML
<div class="row" *ngFor="let item of modules; let i = index;">
<div class="col-md-1 align-center">{{i+1}}</div>
<div class="col-md-5">
<input type="text" class="form-control" [(ngModel)]="modules[i].module_name" value="{{modules[i].module_name}}" disabled>
</div>
<div class="col-md-2">
<input type="radio" class="form-control" [checked]="modules[i].action.read" (change)="modules[i].action.read" name="access_{{modules[i].company_id}}" id="package-1">
<label for="package-1">Read</label>
</div>
<div class="col-md-2">
<input type="radio" [checked]="modules[i].action.write" (change)="modules[i].action.write" class="form-control" name="access_{{modules[i].company_id}}" id="package-2">
<label for="package-2">write</label>
</div>
<button (click)="test(item)">test</button>
</div>
Component
test(val){
console.log(val)
}

Answer 1

There are two issues mainly:
You need to create a unique id for both label and id attributes within the for-loop.
Next, create a method that will toggle the read/write property of each individual module. This ensures that if read is set then write will be false and vice versa.
.ts
toggleReadWrite(module: any, isRead: boolean) {
if (isRead) {
module.action.read = !module.action.read;
module.action.write = false;
} else {
module.action.write = !module.action.write;
module.action.read = false;
}
}
.html
<div class="row" *ngFor="let item of modules; let i = index;">
<div class="col-md-1 align-center">{{i+1}}</div>
<div class="col-md-5">
<input type="text" class="form-control" [(ngModel)]="modules[i].module_name"
value="{{modules[i].module_name}}" disabled>
</div>
<div class="col-md-2">
<input type="radio" class="form-control" [checked]="modules[i].action.read"
(change)="toggleReadWrite(modules[i], true)"
name="access_{{modules[i].company_id}}" id="package+1+{{i}}">
<label for="package+1+{{i}}">Read</label>
</div>
<div class="col-md-2">
<input type="radio" [checked]="modules[i].action.write"
(change)="toggleReadWrite(modules[i], false)" class="form-control"
name="access_{{modules[i].company_id}}" id="package+2+{{i}}">
<label for="package+2+{{i}}">write</label>
</div>
<button (click)="test(item)">test</button>
</div>

Answer 2

First of all, you should make the id of radio buttons unique as you are looping through it.
id="package-1{{i}}"
<input type="radio" class="form-control" [checked]="modules[i].action.read" (change)="modules[i].action.read" name="access_{{modules[i].company_id}}"
id="package-1{{i}}">
<label for="package-1{{i}}">Read</label>
Also, I am not sure what is your desired output, please explain more.