Angular 2：第一个服务成功后的两个后端服务调用

Posted 2023-02-19

【中文标题】Angular 2：第一个服务成功后的两个后端服务调用

【英文标题】：Angular 2: Two backend service calls on success of first service

【发布时间】：2016-08-11 07:02:49

【问题描述】：

在我的 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

欢迎提出任何建议。

【参考方案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对应第一个请求的结果。

我更新了我的答案来描述如何在订阅回调中获取两个请求的结果...

如果你需要两个响应内容，是的;-)