In the code snippet below, my goal is to add objects to an array named selectedComponents in a model-driven form when checkboxes are checked.
The object type of item1 is CampaignProductModel, which belongs to an array called selectedComponents in my form's model.
I am facing difficulties in binding and adding all checked items to the array in my model object.
<p-dataTable *ngIf="previousCampaignProduct" [value]="previousCampaignProduct" #dt [responsive]="true" filter="filter" [rows]="25" [paginator]="true" selectionMode="single" [(selection)]="selectedItem" [contextMenu]="cm">
<p-header>Previous Campaign Products</p-header>
<p-column header="Images">
<template let-item="rowData" pTemplate="body">
<img style="max-height:150px;" src="http://cdnll.somesite.com/images/1000/{{item.itemSku}}.jpg" />
</template>
</p-column>
<p-column field="itemSku" header="Item" [filter]="true" filterMatchMode="contains" filterPlaceholder="Search"></p-column>
<p-column field="components" header="Components">
<template let-item="rowData" let-col pTemplate="body">
<ul style="list-style: none;">
<li *ngFor="let item1 of item[col.field]">
<p-checkbox value="item1" formControlName="selectedComponents" label="{{item1.itemSku}}"></p-checkbox>
</li>
</ul>
</template>
</p-column>
</p-dataTable>
Goal:
To add all checked items from p-checkbox as objects to an array in my model-driven form.
Tried:
value="{{item1}}"
... I knew it wouldn't work