Angular 5中.map()可取数据但.subscribe()返回undefined问题求助

问题点梳理 #

• map操作符无返回值：RxJS的map操作符用于转换上游数据流，必须在回调末尾返回需要传递给下游的结果，当前map回调仅定义变量存储接口返回值，未return任何内容，因此下游订阅拿到的结果默认为undefined。
• 服务方法定义语法错误：functionA作为类方法，名称后缺少括号()，且代码存在多处大括号未闭合的语法问题，会导致方法无法正常返回Observable实例。
• 组件调用方法逻辑错误：functionA是服务类的方法，必须执行（添加()）后才会返回可订阅的Observable对象，当前直接对方法本身调用subscribe，无法拿到正确数据流。

修正后代码 #

serviceA代码 #

// 需提前导入map操作符：import 'rxjs/add/operator/map';
public functionA() {
  let url ='someURL';
  let body = {some: 'params'};
  return this.http.post(url, body).map((res: any) => {
    const data = res;
    // 返回结果给下游订阅者
    return data;
  });
}

componentB调用代码 #

this.serviceA.functionA().subscribe(data => console.log(data));

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