返回修改后的 Observable 值 Angular 6答案

【问题标题】：Returning modified Observable value Angular 6返回修改后的 Observable 值 Angular 6
【发布时间】：2019-03-11 03:09:13
【问题描述】：

考虑以下示例：

 login(context: LoginContext): Observable<Credentials> {

    let credentials = JSON.stringify(context);

    this.httpClient.post("http://localhost:64636/api/Account/login", credentials, {
      headers: new HttpHeaders({
        "Content-Type": "application/json"
      })
    }).subscribe(response => {
      let token = (<any>response).token;

      const data = {
        username: context.username,
        token: token
      };

      this.setCredentials(data, context.remember);
      return of(data);

    }, err => {

    });


  }

这里我想要实现的是封装从httpClient接收到的数据并返回，但这是在httpClient执行完成后完成的。编译器告诉我“声明类型既不是 'void' 也不是 'any' 的函数必须返回一个值”，这是理所当然的。我的问题是，当父可观察对象必须等待 httpClient.post() 可观察对象完成其任务时，如何解决此类问题？

【问题讨论】：

您是否尝试过在this.httpClient.post... 之前添加return 并订阅login ？
是的，这可行，但问题是，我想做将接收到的数据封装在登录函数中然后返回的工作。

标签： angular typescript observable

【解决方案1】：

使用map operator 修改 Observable 返回的值：

login(context: LoginContext): Observable<Credentials> {

  let credentials = JSON.stringify(context);

  return this.httpClient.post("http://localhost:64636/api/Account/login", credentials, {
    headers: new HttpHeaders({
      "Content-Type": "application/json"
    })
  }).pipe(
    map(response => {
      let token = (<any>response).token;
      const data = {
        username: context.username,
        token: token
      };
      this.setCredentials(data, context.remember);
      return data;
    })
  );
}

【讨论】：

是的，我自己只是在阅读地图操作员的描述。这是实现我的目标的正确方法。谢谢。
但是，这并没有消除错误“声明类型既不是'void'也不是'any'的函数必须返回一个值”
抱歉，我忘了return Observable。我做了更正。我假设 data 与 Credentials 类类型兼容（您可能必须转换值）。