Spring 和 Angular：如何在一个条件下一个接一个地进行两次 http 调用

Question

我有一个处理文件上传的 Angular 界面，在提交按钮后它会将此文件保存在 MySQL 数据库中。我想在此提交方法中进行另一个调用，但第二个 http 调用需要该实体的 id 持久化（文件），我不知道如何从上传的文件中检索该特定 ID。

这是我的提交方法：

onSubmit() {

        const statementFile = new StatementFile();

// *******
// here are some business logic
// *******


// this will send POST request and save it to MySQL.
        this.statementFileService.postStatementFile(statementFile).subscribe(
            {
                next : (response) => {
                    alert('You have been submitted your statement file, check MySQL');
                },
                error: (err) => {
                    alert(`there was a problem: ${err.message}` );
                }
            }
        );


// this is the second http request I want to call but it needs particularly the id of that statementFile uploaded.
this.activitiWorkflowService.createPreccess(statementFile.statementFileId).pipe(takeUntil(this._unsubscribeAll), debounceTime(3000)).subscribe(
            (data: any) => data
        );

    }

这是我的 StatementFile class:

export class StatementFile{

    statementFileId: number;
    dateReception: Date;
    label: string;
}

Answer 1

您可以使用 switchMap 运算符来链接请求。 statementFile.statementFileId 或 response.statementFileId 或来自 postStatementFile 请求的其他内容，您将使用它来调用下一个请求。

 this.statementFileService.postStatementFile(statementFile)
      .pipe(
        switchMap(response => this.activitiWorkflowService.createPreccess(statementFile.statementFileId).pipe(takeUntil(this._unsubscribeAll)))
      )
      .subscribe({
          next : (data: any) => data,
          error: (err) => {
             alert(`there was a problem: ${err.message}` );
          }
        }
      );

Spring 和 Angular：如何在一个条件下一个接一个地进行两次 http 调用

Spring and Angular: How to make two http calls one after another with a condition

javascript

java

spring

typescript

angular