javascript - 在 Angular 5 中继续循环之前等待 for 循环中的 observable 完成

Question

我正在遍历一组对象(称为项目)。 forEach 循环包含返回可观察对象的服务调用。我试图等待处理数组中的下一个项目，直到循环内的可观察对象完成。我应该使用什么？我已经尝试过 forkJoin。

projects
    .forEach(project => {
        this.imageService.getProjectImages(project.projectId.toString(), true, true, undefined)
            .catch(err => observer.error(err))
            .finally(() => {
                // process next project
            })
            .subscribe((image: FileRepresentation) => {
                data.image = image;
                this.getSlide(project, data);
            });
})

Answer 1

如果你想同时运行一个 Observable，并且只在前一个 Observable 完成后才开始下一个，那么 forkJoin 不是一个好的选择，因为它会立即订阅所有源 Observable。一种更好的方法是使用所谓的高阶 Observable 并使用 concatAll 一个接一个地订阅:

const projects = [
  Observable.of(1).delay(1000),
  Observable.of(2).delay(1000),
  Observable.of(3).delay(1000),
];

Observable.from(projects)
  .concatAll()
  .subscribe(console.log);

这通过创建延迟为 1 秒的 Observable 来模拟 HTTP 调用。如果运行此示例，您会看到它以 1 秒的延迟打印每个数字:

查看现场演示:http://jsbin.com/zocuma/3/edit?js,console