我有一系列图像对象。
console.info('gallery', galleryArray);
该数组的长度可以不同。我必须对该数组的每个项目发出 POST 请求。只有在前一个请求完成后,才能执行下一个请求。
所以我尝试发出一系列可观察的请求,如下所示:
let requests: Observable<Response>[] = [];
galleryArray.forEach((image) => {
requests.push(this._myService.uploadFilesImages(image));
});
console.info(requests);
我的服务如下所示:
uploadFilesImages(fileToUpload: any): Observable<any> {
const input = new FormData();
input.append('image', fileToUpload);
return this.uploadHttp.post(`${this.endpoint}`, input)
.map(
(res: Response) => res.json()
);
}
问题是如何执行这些请求,以便每个 api 调用仅在前一个请求完成后才进行?请帮助。我是角度新手。
您正在寻找concatMap
操作员:
Example
const apiRoot = 'https://jsonplaceholder.typicode.com/';
const urls = [];
for (let i = 0; i < 500; i++) {
urls.push(apiRoot + 'posts/' + (i + 1));
}
Observable.of(...urls)
.concatMap((url: string) => this.http.get(url))
.subscribe((result) => console.log(result));
The concatMap
运算符仅在可观察对象的当前迭代完成后才会发出。您可以在subscribe
block.
在您的具体情况下:
Observable.of(...galleryArray)
.concatMap((image) => this._myService.uploadFilesImages(image))
.subscribe((result) => console.log(result));
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)