Question

我正在构建一个Angular 4应用程序，其中包含用户的详细信息。该表有一个单击的添加按钮，动态生成一行。该行具有很少的用户细节，删除按钮用于删除相应的行。我能够动态创建行。要删除相应的行，我不确定这样做。我试着分配一个像

这样的函数

  <td> <input type="button" value="Delete" name="Delete" id="deleteRowBtn" (click)="deleteRow($(this))"></td>

deleteRow函数有

console.log("deleting row");
   thisObj.closest('tr').empty();

这不起作用。有人可以建议吗？

Answer 1

您只需要从组件更新模型即可删除该行。

<tr *ngFor=" let x of users; let i = index;">
   <td>{{x.someUserData}}</td>
   <td><input type="button" value="Delete" name="Delete" id="deleteRowBtn" (click)="deleteRow(i)"></td>
</tr>

然后您可以使用此索引

从您的收藏中拼接

deleteRow (index:number) {
   this.users.splice(index, 1); //replace your Model here instead of this.user
}

Angular 4：如何删除动态生成的行？

1 个答案: