Question

我有一个表内容，在其中创建了该列表的视图并对其执行编辑和删除任务。

我正在通过在服务中调用splice方法并在组件中通过id对其进行服务来进行尝试。

table.component.ts ：

 delete(com) {
    this.service.DeleteUser(com);
    console.log(com);
}

table.component.html ：

<a class="btn btn-outline-danger  btn-sm" (click)="delete(com.id)">Delete</a>

服务：

 DeleteUser(index: number) {
    this.company.splice(index, 1);
    this.company_change.next(this.company.slice());
  }

我想获取工作状态下的删除按钮，company:Company[]列表是根据类型model创建的。

Answer 1

尝试一下：

在点击功能删除操作中用i替换com.id

<tr class="table-active" *ngFor="let com of company;  let i = index">
        <td>{{com.co_name}}</td>
        <td>{{com.co_profile}}</td>
        <td>{{com.co_address}}</td>
        <td>{{com.co_email}}</td>
        <td>
          <a class="btn btn-outline-secondary btn-sm" [routerLink]="['/table',com.id]">
            Edit
          </a>
          <a class="btn btn-outline-danger  btn-sm" (click)="delete(i)">Delete</a>
        </td>
      </tr>

Answer 2

在此处id传递公司(click)="delete(com.id)"（而非索引）时，您必须过滤公司列表以查找其ID与您传递的ID相匹配的公司的索引（i），然后根据索引拼接公司列表。

尝试这样：

 DeleteUser(id: number) {

    for(let i=0;i<this.company.length;i++) {
      if(this.company[i].id == id) {
        this.company.splice(i, 1)
      }
    }
  }

如何通过单击删除它。

2 个答案: