可观察地图功能未运行（Angular2，http）答案

【问题标题】：Observable Map function not running (Angular2, http)可观察地图功能未运行（Angular2，http）
【发布时间】：2023-04-06 17:33:02
【问题描述】：

更新

问题似乎是地图功能没有在“失败”的请求上运行。这意味着，如果我正在与之交谈的 API 返回 422 Validation Failed 错误（或其他 4xx 错误），Angular 会将其视为失败并导致观察者运行订阅的错误回调，并在此过程中跳过 map 函数。

是否可以强制 Angular 将某些 4xx 错误视为成功请求，或者即使 Observable 返回错误也强制 map 函数运行？

我的 Angular2 应用程序中运行了以下代码：

import {Injectable} from "angular2/core";
import {Observable} from "rxjs/Rx";
import {Http, Headers, ResponseOptions, Response} from "angular2/http";
import 'rxjs/add/operator/map';

...

public login (email : string, password : string) {
    return this.http.post(_endPoint + '/auth/login/', JSON.stringify({
        email: email,
        password: password
    }), {
        headers: new Headers({
            'Content-Type': 'application/json'
        })
    })
    .map (res => {
        let data = res.json();
        console.log(data);
        return data;
    });
}

代码执行良好，但未触发 map 函数。我没有收到任何错误，并尝试使用和不使用import 'rxjs/add/operator/map' 运行代码，结果相同。我还尝试了一个更简单的地图函数.map (res => res.json());。

在这两种情况下，我都希望 .subscribe() 函数返回的结果是 JSON 响应，但我得到的是原始响应。

编辑：添加了请求数据和响应的屏幕截图

回复：

[{"field":"email","message":"Email or password incorrect."},{"field":"password","message":"Email or password incorrect."}]

我还在一个完全成功的请求（状态代码：200）上对其进行了测试，并且地图功能似乎工作正常。所以我猜它只在返回成功响应时运行。有没有办法让它运行，或者指定它应该运行的其他状态代码？

【问题讨论】：

您能否向我们提供您的回复内容？ HTTP 状态码、标头和有效负载？谢谢！
Checkout stackoverflow.com/questions/34113750/… ... 向下滚动以查看@MichaelOryl 提到的 SystemJS 配置
@thierrytemplier 我有状态、标头、有效负载和响应的屏幕截图。我还详细说明了成功响应后会发生什么。
@Tam 感谢您提供更多详细信息。我刚刚为您提供了基于catch 和Observable.throw 方法的解决方案。希望它会帮助你;-)

标签： angular observable rxjs angular2-http

【解决方案1】：

正如与 cmets 所讨论的，map 方法不会被调用，因为响应包含 422 状态代码，即错误。所以直接调用catch方法。

如果您需要提取与错误对应的 JSON 内容，您可以在服务中尝试类似的操作：

getCompanies() {
  return this.http.get('https://angular2.apispark.net/v1/companies1/', {
    headers: headers
  }).map(res => res.json()).catch(err => Observable.throw(err.json());
}

现在在调用服务的组件中，您将能够订阅。在您的情况下，将使用响应的 JSON 内容调用第二个参数：

service.getCompanies().subscribe(
  data => console.log('data = '+data),
  err => console.log('err = '+JSON.stringify(err, null, 2)), // <---
  () => console.log('complete')
);

打印出来的内容是：

err = {
  "code": 404,
  "description": "The server has not found anything matching the request URI",
  "reasonPhrase": "Not Found"
}

希望对你有帮助蒂埃里

【讨论】：