createProject出错时createProjectDetails仍执行，能否将其放入next回调？

当然可以把createProjectDetails的调用放到createProject的next回调里，这正是解决你当前问题的正确方式——这样只有当createProject请求成功返回后，才会触发创建项目详情的请求；如果createProject执行出错，createProjectDetails就不会被调用，完全符合你的需求。

修改后的代码示例 #

调整后的onSubmit函数 #

onSubmit() {
  this.projectService.createProject().subscribe({
    next: data => {
      console.log('项目创建成功:', data);
      // 仅在createProject成功后调用createProjectDetails
      this.projectService.createProjectDetails().subscribe({
        next: detailData => {
          console.log('项目详情创建成功:', detailData);
        },
        error: err => {
          console.log('项目详情创建失败:', err);
        }
      });
    },
    error: err => {
      console.log('项目创建失败:', err);
    } 
  });
}

更优雅的RxJS链式写法（推荐） #

如果你想避免嵌套subscribe，可以用RxJS的concatMap操作符实现顺序调用，代码结构更清晰：

import { concatMap } from 'rxjs/operators';

onSubmit() {
  this.projectService.createProject()
    .pipe(
      concatMap(projectData => {
        console.log('项目创建成功:', projectData);
        return this.projectService.createProjectDetails();
      })
    )
    .subscribe({
      next: detailData => {
        console.log('项目详情创建成功:', detailData);
      },
      error: err => {
        console.log('请求失败:', err);
        // 此处会捕获createProject或createProjectDetails中任意一个的错误
      }
    });
}

服务层代码无需修改 #

你的projectService中的两个方法保持原样即可：

createProject(): Observable<any> {
  return this.http.post(PROJECT_URL + "createProject", httpOptions);
}

createProjectDetails(): Observable<any> {
  return this.http.post(PROJECT_URL + "createProjectDetails", httpOptions);
}

内容的提问来源于stack exchange，提问作者hansvdzz