获取已启用复选框的 ID 列表 angular

Question

我有一个 table，其中有特定的列作为复选框。我分配了一个空列表。所以我想要的是我想要启用复选框的行的 ID。例如，如果在 id 4 和 5 中启用了复选框，则列表应为 [4,5]

示例数据：

 { id:1,
  name: "A",
  qty: 6,
  value: 10
},
{  id:2,
  name: "B",
  qty: 4,
  value: 10
},
{  id:3,
  name: "C",
  qty: 1,
  value: 10
}

从服务获取数据：

 ngOnInit(): void {
this.dataService.getData().subscribe(res => {
  this.listes = res;
});

}

列表名称：

  checkboxselectlist: any[];

我的 stackblitz：https://stackblitz.com/edit/angular-ivy-4vnwed?file=src%2Fapp%2Fapp.component.ts

Answer 1

这应该对你有帮助。

您需要将事件处理程序传递给 ngchange。
在事件处理程序中，您可以获得应该可以帮助您更新列表的元素 ID。 checkboxselectlist

// in your app.component.ts
filterResults(obj: any, e: any) {
   console.log(obj); 
   console.log(e.currentTarget.checked); // true or false
   // UPDATE LIST HERE
 }

// in your app.component.html
<tr *ngFor="let list of listes; index as i">

<td>{{i+1}}</td>
<td>{{list.name}}</td>
<td>{{list.qty}}</td>
<td>{{list.value}}</td>
<td> <input type="checkbox" id="vehicle1"
            name="vehicle1"
           (change)="filterResults(list, $event)">
</td>
</tr>

获取已启用复选框的 ID 列表 angular

Getting list of ids of enabled checkboxes angular

javascript

typescript

angular

angular5

angular6