【问题标题】:Angular 2: Two backend service calls on success of first serviceAngular 2:第一个服务成功后的两个后端服务调用
【发布时间】:2018-01-25 17:41:00
【问题描述】:

在我的 Angular 2 应用程序中,我有如下后端服务。

getUserInterests() {
    return this.http.get('http://localhost:8080/test/selections').map((res: Response) => res.json());
}

调用此服务后,我想在前一个服务成功时调用另一个服务。

第二次服务

let params: URLSearchParams = new URLSearchParams();
    params.set('access_token', localStorage.getItem('access_token'));
    return this.http.get('http://localhost:8080/user/selections', { search: params }).map((res: Response) => res.json());

这两个服务分别返回两个 JSON 数组。然后我需要用这两个数组做一些登录。

已编辑

service.ts

getUserInterests() {
    return this.http.get('http://localhost:8080/test/selections').map((res: Response) => res.json());
}

getSavedSelections() {
    let params: URLSearchParams = new URLSearchParams();
    params.set('access_token', localStorage.getItem('access_token'));
    return this.http.get('http://localhost:8080/interest/user/selections', { search: params }).map((res: Response) => res.json());
}

getSelectionList() {
    var obs = this.getUserInterests().flatMap(
        (interests) => {
            return Observable.forkJoin([
                Observable.of(interests),
                this.getSavedSelections()
            ]);
        }
    );
    return obs;
}

然后我在我的其他 ts 文件中使用以下内容来调用服务。

export class InterestsComponent {
  private interests;
  private saved_interests;
  constructor(private dataService: DataService) {
    this.dataService.getSelectionList().subscribe(
        (result) => {
            var interests = result[0];
            var selections = result[1];
        }
    );
  }
}

但这会在控制台日志中出现以下错误。

ORIGINAL EXCEPTION: TypeError: this.dataService.getSelectionList is not a function

欢迎提出任何建议。

【问题讨论】:

    标签: javascript angular angular-services


    【解决方案1】:

    您需要利用flatMap 运算符在前一个请求完成后调用一个请求:

    this.service.getUserInterests().flatMap(
      (interests) => {
        let params: URLSearchParams = new URLSearchParams();
        params.set('access_token', localStorage.getItem('access_token'));
        return this.http.get('http://localhost:8080/user/selections', {
          search: params
        }).map((res: Response) => res.json());
      }
    );
    

    订阅此数据流时,只会收到最后一次请求的结果。

    您可以使用Observable.forkJoin 方法返回两者。这是一个示例:

    var obs = this.service.getUserInterests().flatMap(
      (interests) => {
        return Observable.forkJoin([
          Observable.of(interests),
          this.service.getUserSelections()
        ]);
      }
    );
    
    obs.subscribe(
      (result) => {
        var interests = result[0];
        var selections = result[1];
      }
    );
    

    【讨论】:

    • 什么是兴趣?
    • 如何获得两个服务的响应?
    • interests对应第一个请求的结果。
    • 我更新了我的答案来描述如何在订阅回调中获取两个请求的结果...
    • 如果你需要两个响应内容,是的;-)
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-09-24
    • 2017-06-17
    • 2020-03-29
    • 2018-03-09
    • 1970-01-01
    相关资源
    最近更新 更多