angular - 如何在 Angular 中顺序发送多个 Http 请求

标签 angular rxjs angular6 angular7

我编写了下面的代码,以便每次在发布请求发生之前调用 API, 第一个 API 被调用,第二个 API 没有被调用

  public post(postUrl: string, model: any): Observable<any> {
    return this.validateTokenStatus().pipe(map(response => {
        console.log('response', response);
        // if (response) {
        console.log('response2', response);
        const url = `${environment.webApiUrl}/${postUrl}`;
        this.spinnerService.start();
        console.log('response21', response);
        return this._http.post(url, model).pipe(map((res: any) => {
            console.log('response11', response);
            this.spinnerService.stop();
            return res;
        },
        error => {
            console.log('error');
            return error;
        }));
        // } else {
       // console.log('response3', response);
        // return true;
        // }
    }));
}

最佳答案

当您想要按顺序执行多个异步操作时,您通常会希望使用 mergeMap、switchMap 或 concatMap 之一。在这种情况下,类似的事情可能会起作用:

return this.validateTokenStatus()
  .pipe(
    switchMap(response => {
        const url = `${environment.webApiUrl}/${postUrl}`;
        this.spinnerService.start();
        return this._http.post(url, model);
    }),
    map((res: any) => {
        this.spinnerService.stop();
        return res;
    })
  );

关于angular - 如何在 Angular 中顺序发送多个 Http 请求,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55901788/

相关文章:

javascript - 以 Angular 创建嵌套的动态组件

javascript - RXJS Observables - 对每个索引值和合并结果的 http 调用

angular - 如何在 Angular 2.0 中使用 formControl 访问 native HTML Input 元素

angular - Jasmine : Spying an exported function that is called by an another function doesn't work

unit-testing - 如何在 Angular2 中使用 karma-jasmine 对 ng2-translate 进行单元测试

Angular APP_INITIALIZER

angular - 如何使用 Jasmine 测试多个顺序调用

node.js - 在 ./src/.././src/app/app.browser.module.ts 中找不到 Angular 6 Bootstrap

angular - 创建没有文件夹的组件

angular - 在 RxJS 6 和 Angular 6 出现错误后如何保持可观察性