javascript - primeNg 数据表中的复选框绑定(bind)对象

Question

https://www.primefaces.org/primeng/#/checkbox

在下面的代码中，我尝试获取复选框以将对象添加到模型驱动形式的数组中，变量名称为 selectedComponents。

因此，下面 item1 的对象类型是 CampaignProductModel，它是我的表单模型中名为 selectedComponents 的数组。

我在绑定(bind)和添加所有已检查项目到模型对象中的数组时遇到问题。

 <p-dataTable *ngIf="perviousCampaignProduct" [value]="perviousCampaignProduct" #dt [responsive]="true" filter="filter" [rows]="25" [paginator]="true" selectionMode="single" [(selection)]="selectedItem" [contextMenu]="cm">
    <p-header>Pervious 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> 

目标

将 p-checkbox 中的所有检查项目作为对象添加到我的模型驱动表单中的数组中。

尝试过:

value="{{item1}}"

...知道这行不通

Answer 1

有点晚了，但我认为这可以解决您的问题更改此代码:

 <p-checkbox value="item1" formControlName="selectedComponents" label="{{item1.itemSku}}"></p-checkbox>

对于这个:

 <p-checkbox [value]="item1" formControlName="selectedComponents" [label]="item1.itemSku"></p-checkbox>