I have successfully figured out how to remove a single row from a table using splice method. Now, I am looking to extend this functionality to remove multiple rows at once.
html
<tr *ngFor="let member of members; let i = index;">
<td>
<input type="checkbox" (change)="selChk(member.id, i)"
[checked]="false">
</td>
</tr>
This will label each row as 0, 1, 2, 3, and so on with every loop iteration.
component
Below is the list of ids from checkboxes that have been checked.
For instance, if I check the first and second rows, it will capture rows 0 and 1. Later, I can click on the remove multiple buttons to use these rows for splicing.
selChk(val:number, ind:number) {
var i = this.id.indexOf(val);
if(i === -1){
this.id.push(val);
this.ind.push(index);
}else{
this.id.splice(index,1);
}
}
The following code snippet will execute when the remove multiple button is clicked. It logs the indices of the rows that need to be deleted. However, I am unsure about how to perform multiple splices at once.
removeSel() {
console.log(this.ind);
}