Question

这是我用于删除员工的打字稿代码。

deleteEmployee(id:number){
this.empserv.deleteEmployee(id).subscribe(data=>this.delData=data,
  error=>this.errorMsg=JSON.parse(JSON.stringify(error)));

if(this.errorMsg)
  this.employees=this.employees.filter(obj=>obj.customerId!=id);
  alert("Employee Deleted Successfully"+id);
}

这是我的HTML

<td>
   <button class="btn btn-dark" (click)="deleteEmployee(f.customerId)">
   DELETE
   </button>
</td>

该代码第二次可以正常工作，但是，第一次仅警报有效时，列表既不在屏幕上也不在控制台上得到更新。我试图记录errorMsg，但是第一次没有任何结果。可能是什么原因？

Answer 1

我的一个可能原因是您在订阅后正在检查错误。

deleteEmployee(id:number){
  this.empserv.deleteEmployee(id)
   .subscribe(
      data => this.delData=data,
      error => {
        this.errorMsg=JSON.parse(JSON.stringify(error));
        this.employees=this.employees.filter(obj=>obj.customerId!=id);
        alert("Employee Deleted Successfully"+id);
      });
}

Answer 2

您正在混合两件事：

1。异步代码：

您的程序不会在主线程中运行此代码，而是仅在服务器发送您的请求响应时运行此代码。您的程序将不等待该代码执行并继续其执行流程。在您的代码中，异步部分是：

this.empserv.deleteEmployee(id)
   .subscribe(
     data=>this.delData=data,
     error=>this.errorMsg=JSON.parse(JSON.stringify(error)));

2。同步代码：

此代码将在主线程中运行，并且不会等待异步代码的执行。

在您的程序中，同步部分是：

if(this.errorMsg)
  this.employees=this.employees.filter(obj=>obj.customerId!=id);
  alert("Employee Deleted Successfully"+id);
}

这里的主要问题是代码的同步部分取决于异步部分，该异步部分将在服务器发送响应时在某个时间点运行，但是您的代码将在该时间之前运行，而this.errorMsg将在不确定。

您应该将此逻辑放在异步部分中，以使其仅在返回服务器的响应时才运行。类似这样的事情：

this.empserv.deleteEmployee(id)
   .subscribe(
     data=>this.delData=data,
     error=>{
      this.errorMsg=JSON.parse(JSON.stringify(error));
      this.employees=this.employees.filter(obj=>obj.customerId!=id);
      alert("Employee Deleted Successfully"+id);
     });
}

代码第一次无法使用。无法解决问题

2 个答案: