Angular 4 - 从表中删除多行

时间:2017-10-26 06:03:49

标签: javascript angular typescript

我已经能够使用splice从表中删除单行。 我现在想要的是删除多行

HTML

<tr *ngFor="let member of members; let i = index;">
    <td>
      <input type="checkbox" (change)="selChk(member.id, i)"  
      [checked]="false">
    </td>
</tr>

所以每一行的每个循环都会被标记为0,1,2,3,4 ......

组件

下面的

是我选中的复选框中的ID列表。

当我检查时,例如,第一行和第二行。它会得到0,1行。然后我将点击删除多个按钮以使用行

拼接记录
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);
   }

}
单击删除多个按钮时,将触发下面的

代码。返回要删除的正确行。 但我不知道如何拼接多个。

 removeSel() {
   console.log(this.ind);
  }

1 个答案:

答案 0 :(得分:0)

在组件代码中添加以下功能:

 removeSel() {
  this.members = this.members.filter((_, idx) =>this.ind.indexOf(idx) === -1)
 }

点击你的删除多个按钮调用此removeSel函数: (click) = "removeSel()"

参考: MDN Filter