如何在Angular/tyscript中使用HTTP请求对API服务器的响应延迟

Question

我正在向API服务器提出HTTP POST请求。我有一个函数来呼叫，然后根据响应的值返回对还是错。但是，当我尝试评估响应时，它是未定义的，因此我的功能总是返回false。

我考虑过一会儿(响应==未定义(循环只是等到在评估该值之前定义值，但是还有其他解决方案吗？

apiCall(): any{
 let headers: HttpHeaders = new HttpHeaders();
 headers.append('Content-Type', 'application/json');
 var result; 
 this.http.post(this.url, this.data, {headers: headers}).subscribe(
  res => {
    result = res; 
  }
 );
 return result; 
}
evaluate() : boolean {
 var response = apiCall();
 if(response == 1968){
    return true; 
 }
 else return false; 
}

我想根据API响应的值从我的评估函数中返回True或false。

Answer 1

这对JavaScript的新移民来说是一个简单但非常令人困惑的技工，这是一种按设计的单线程异步语言，它使许多方面变得更加容易...

不可能明确延迟执行代码，例如其他语言。您的代码在做什么，创建结果变量，执行请求，订阅请求，然后立即返回result变量，该变量仍然是undefined。

订阅时，您使用速记箭头语法传递回调函数。data => { ... }基本与function(data) { ... }相同。

接收到响应时，执行回调函数，将更新变量。但是，这毫无意义。result变量仅在apiCall函数的范围内可用，该函数已经返回，您更新一个不再使用的变量。

var response = apiCall();

Apicall将立即使用空的result变量返回。该请求正在后台处理。while循环无法工作，它们将阻止线程，这意味着它无法处理响应并创建无用的工作。解决方案要简单得多，遵守异步逻辑的规则。

我会让您对异步JavaScript(回调，承诺，异步/等待(进行一些研究，但是Angular可以轻松使用subscribe模式。在下面，它使用Rxjs和可观察到。

最简单的方法是关注文档。您的API调用应返回可观察到的http.post，并且该数据的任何消费者都应订阅它，并通过稍后执行的函数。

请记住，任何回调很可能不会与代码的其余部分同时执行。将其视为链条，每个链条都导致下一个事件。这就是它应该工作的方式，不应该有任何纵横交错。

function apiCall() {
...
return this.http.post("https://...", data, headers);
}
function getData() {
apiCall()
  .subscribe(data => {
    if (data.response === 200) {
      ...do something now that the response is known
    }
  });
}

牢记，出于相同的原因，您无法从getData返回True/fals，它已经返回。您必须继续进行链条操作，或者如果您真的想尝试该方法，请参见async/await。

Answer 2

您可以通过在有问题的请求中使用setTimeout()来解决问题。