Angular 4链接http获取请求（Promises） [英] Angular 4 chaining http get request(Promises)

问题描述

我希望得到以下代码的一些帮助：

  fillDataAssociationsArray（DataAssociationIDS：string []）{
 $ const promise = new Promise（（resolve，reject）=> {
 for（DataAssociationIDS的常量id）{
 this.api.getDataAssociationByID（id）.toPromise（）。then（
 data => {
 this.DataAssociations.push（data.body.entities.DATAASSOCIATIONS [0]）; 
}）; 
} 
 resolve（）; 
}）; 
 
 return promise;} 
  

在上面的代码中，我试图转换DataAssociationIDS到DataAssociation对象的数组，并将它们推送到DataObjects []的本地数组。我从数组（参数）中获取每个DataObject的一个id，然后执行一个get请求到API，从后端返回正确的DataObject

  public getDataAssociationByID（dataAssociationID：string）{
 return this.http.get< DataAssociationInterface>（this.apiURL +'typeOne = DATAASSOCIATIONS& id ='+ dataAssociationID，
 {observe：'响应'}）;} 
  

我想链接一些来自我的api的HTTP请求，每个请求都取决于前一个请求的结果。所以我的想法是承诺这些请求，并使用then（）方法，如下所示：firstRequest（）。then（SecondRequest（）。then（...）），以便遵循。

My try

  ngOnInit（）{
 this。 fillDataAssociationsArray（this.extractDataAssociationIdsFromActivities（））。然后（
（）=> console.log（this.DataAssociations）
 //（）=> console.log（this.DataAssociations [0]。 languages.DUT.name）
）;} 
  

第一个结果
第二行结果

then（） - 块中的第一行打印正确的结果本地数组，然而，当我尝试第二行（评论）打印项目的名称我得到未定义？当我链接下一个请求时，它也无法读取undefined。

解决方案

我认为你在这里有一个异步问题。

在您从http get call获得您的结果之前，您可能会解决您的承诺。

I认为解决这个问题的最好方法是添加一个api调用来获取一个id数组并返回一组结果。然而，对于这种用例，我的方法是：
$ b

fillDataAssociationsArray（DataAssociationIDS：string []）{const promise = new Promise（（resolve，reject）=> {for（DataAssociationIDS的常量id）{this.api.getDataAssociationByID（id）.toPromise（）。then（data => {this.DataAssociations .push（data.body.entities.DATAASSOCIATIONS [0]）; if（this.DataAssociations.length === DataAssociationIDS.length）{resolve（）;}}）;}}）; return promise;}

I would like to receive some help on the following code:

fillDataAssociationsArray(DataAssociationIDS: string[]) {
const promise = new Promise((resolve, reject) => {
  for (const id of DataAssociationIDS) {
    this.api.getDataAssociationByID(id).toPromise().then(
      data => {
        this.DataAssociations.push(data.body.entities.DATAASSOCIATIONS[0]);
      });
  }
  resolve();
});

return promise;}

In the code above I am trying to convert an array of DataAssociationIDS to DataAssociation objects, and than pushing them to a local array of DataObjects[]. I get each DataObject with an id from the array(parameter) and than performing a get Request to the API which returns the correct DataObject from the Backend.

public getDataAssociationByID(dataAssociationID: string) {
return this.http.get<DataAssociationInterface>(this.apiURL + 'typeOne=DATAASSOCIATIONS&id=' + dataAssociationID,
 { observe: 'response' });}

I want to chain some HTTP get requests from my api, where each request depends on the result of the previous request. So my idea was to make promises of these requests and use the then() method as follows: firstRequest().then( SecondRequest().then(...)) and so to follow.

My try

ngOnInit() {
   this.fillDataAssociationsArray(this.extractDataAssociationIdsFromActivities()).then(
  () => console.log(this.DataAssociations)
  // () => console.log(this.DataAssociations[0].languages.DUT.name)
);}

First result Second line result

This first line in the then()-block prints the correct resulting local array however, when I try the second line(commented) which prints the name of the item I get undefined??? And when I chain the next request it also cant read undefined obviously.

解决方案

I think you have an async issue here.

Its possible that you are resolving your promise before you are getting your result from http get call.

I think the best way to fix this issue would be to add an api call to take an array of ids and return an array of results. However for this use case my approach would be:

fillDataAssociationsArray(DataAssociationIDS: string[]) {
const promise = new Promise((resolve, reject) => {
  for (const id of DataAssociationIDS) {
    this.api.getDataAssociationByID(id).toPromise().then(
      data => {
        this.DataAssociations.push(data.body.entities.DATAASSOCIATIONS[0]);
        if (this.DataAssociations.length === DataAssociationIDS.length) {
          resolve();
        }
      });
  }
});

return promise;}

这篇关于Angular 4链接http获取请求（Promises）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！