How to bind checkbox in angular 7?

Question

<form #checkboxForm="ngForm" name="checkboxForm">
        <table><th>Some Group</th>
            <th>Some Status</th>
             <tr>
                    <td><label for="checkbox" class="checkbox">
                            <input id="checkbox_group" type="checkbox" value="{{groupData[0].Id}}"  [(ngModel)]="groupData[0].checked"
                                [ngModelOptions]="{standalone: true}" (change)="groupNotSelected()"
                                checked /><i class="skin"></i><span>{{groupData[0].GroupDesc}}</span>
                        </label></td>
                        <td>
                             <span>{{groupData[0].GroupStatus}}</span>
                        </td>
                    </tr>    
        </table>
        <a style="border-radius: 25px;border:1px solid #CCC;padding:5px;text-decoration: none" (click)="submitdata()">Submit to myPrice</a>
        </form>

Form with Data binding

Below is the function through which i am binding and passing request details to backend api.

submitdata() {
//console.log(this.groupData[0].checked);

let refreshReq = {
"action":"submit",
"Id": this.groupData[0].Id,
"dataIds": [this.groupData[0].Id]
}

this.some.postData(api, refreshReq)
    .subscribe(data => {
            console.log(data);
    }, error => {

    });

}

Question is how can i bind data so that on select of checkbox i can able to pass only selected checkbox value .

Answer 1

submitdata() {
//console.log(this.groupData[0].checked);
let request = this.groupData.filter(p => p.checked)
for(let j=0;j<request.length;j++)
{
  this.selGroups = request[j].Id;
  this.selsolid = request[j].SolutionId;
  console.log(this.selGroups);
}

console.log(this.selGroups);
//console.log(request);
let refreshReq = {
"action":"submit",
"SolutionId": this.selsolid,
"Ids": [this.selGroups],
"reqDesc" :"INR"
}

this.some.postData(api, refreshReq)

    .subscribe(data => {
            console.log(data);
    }, error => {

    });}