如何在for循环中进行API调用，以等待一个调用完成，然后再使用Observable在Angular中进行另一个调用

Question

我有一个for循环，它根据数组的长度进行一个API调用。如果数组的长度为6，那么将有6个API调用，问题是这些调用都是异步调用，所以其中一些调用给了我错误。我如何对循环中的每个API调用进行处理，直到它完成，然后才能进行另一个调用？

我真的想用可观察性来做这件事，而不是承诺

这是我的服务，我在这里打

respuestaEncuesta(respuesta:any,idEncuesta:number,idPregunta:number){
return this.http.post(this.API_URL+'api/encuestas/'+idEncuesta+'/preguntas/'+idPregunta+'/respuesta',respuesta,this.httpOptions)
}

这是我的for循环，我在函数中唯一做的就是发送数组，然后进行循环，这是在我的ts上，这里我调用在服务中进行API调用的函数

for (let j=0;j < this.obj.data.length; j++){
this.userService.respuestaEncuesta(this.obj.data[j],this.id,this.auxPreguntas[j])
.subscribe(
res => {
let auxRes:any;
auxRes = res;
if(auxRes.estado == 'success'){
console.log('successful call')
}
},
err => {
console.log(err)
}
)
}

我尝试过这样的forkjoin，但没有成功，有些请求没有发送

respuesta:any = [];
for (let j=0;j < this.obj.data.length; j++){
this.respuesta.push(this.userService.respuestaEncuesta(this.obj.data[j],this.id,this.auxPreguntas[j])) 
}
forkJoin(this.respuesta)
.subscribe(
results => {
console.log(results);
}
)

Answer 1

您可能正在寻找concatMap

示例

stackblitz：https://stackblitz.com/edit/angular-ivy-ms2yst?file=src/app/app.component.ts

let data = [1, 2, 3];
of(...data)
.pipe(
// use a concatmap
concatMap(value => {
return of(value).pipe(delay(2000)) 
// this represents your request
})
)
.subscribe(item => {
console.log(item);
// requests should now be made one after another, do whatever
});