Comment faire une demande http avec boucle imbriquée

Question

Dans mon application, je dois envoyer une requête HTTP dans une boucle imbriquée comme je montre ci-dessous:

for(let i=1;i<Names.length;i++) { 
    for(let k=1;k<Data.lenght;k++) { 
     let url = hostPath + "/"+Names[i] + "/" + Data[i]; 
     this.http.get(url); 
    } 
} 

je l'ai fait ci-dessus exigence de la manière décrite ci-dessous:

for(let i=1;i<Names.length;i++) { 
    Observable.from(Data).ConcatMap((data) => { 
     let url = hostPath + "/" + Names[i] + "/" + data; 
     this.http.get(url); 
    }).subscribe(() => {}) 
} 

Je veux maintenir le bon ordre en ce qui concerne le tableau Names (boucle externe), mais peut envoyer la demande parallèle pour le réseau Data (boucle interne). Je suis très nouveau à angulaire, Y at-il un autre moyen de le faire?

Answer 1

Vous pouvez le faire, un petit problème est que vous devez gérer un tableau vide avec defaultIfEmpty. Le code suivant gère également:

let allData$ = Names.map(name => Observable.forkJoin(
    Data.map(d => { 
     const url = hostPath + '/' + name + '/' + d; 
     return this.http.get(url); 
    })).defaultIfEmpty([]); 
); 

Observable.forkJoin(allData$).defaultIfEmpty([]).subscribe(); 
// You will get data in same order here 

Answer 2

Un excellent outil pour atteindre votre objectif sont les fonctions asynchrones JavaScript. La solution proposée suggère deux fonctions: la première envoie les Data promesses en parallèle et le second envoie les Names promesses en utilisant successivement les Data parallèles les:

/** 
 
* Sends the Data promises in parallel and returns the promise 
 
* 
 
* @param {string} param the name from the Names array 
 
* @param {array} array the Data array 
 
* @returns {promise} 
 
*/ 
 
function processParallel(param, array) { 
 
    return Promise.all(array.map((element) => { 
 
     // make sure to call $http and hostPath correctly here because of 
 
     // the function scope change 
 
     let url = `${hostPath}/${param}/${element}`; 
 
     return $http.get(url); 
 
    })); 
 
} 
 

 
/** 
 
* Sends the Names promises sequentially 
 
* 
 
* @param {array} firstArray the Names array 
 
* @param {array} secondArray the Data array 
 
*/ 
 
async function processSequential(firstArray, secondArray) { 
 
    for (let i = 0; i < firstArray.length; i++) { 
 
     await processParallel(firstArray[i], secondArray); 
 
    }; 
 
}

Vous pouvez les appeler ainsi comme suit:

processSequential(Names, Data); 

Vous pouvez tester cette solution dans cet exemple simplifié:

const hostPath = '/home'; 
 
function processParallel(param, array) { 
 
    return Promise.all(array.map((element) => { 
 
     let url = `${hostPath}/${param}/${element}`; 
 
     return new Promise((resolve) => { 
 
      setTimeout(() => { 
 
       console.log(url); 
 
       resolve(); 
 
      }, 500); 
 
     }); 
 
    })); 
 
} 
 
async function processSequential(firstArray, secondArray) { 
 
    for (let i = 0; i < firstArray.length; i++) { 
 
     await processParallel(firstArray[i], secondArray); 
 
    }; 
 
} 
 
processSequential(['John', 'Sarra', 'Marie'], ['1', '2', '3']);

Hope this helps.