Angular 2 获取请求错误响应，答案

【问题标题】：Angular 2 Get request error response,Angular 2 获取请求错误响应，
【发布时间】：2017-06-07 12:19:07
【问题描述】：

我需要向 API 发送 POST 请求，如果响应代码 == 400 从响应中获取信息。 http://joxi.ru/l2ZM0KES0M8ZmJ

public contactUsSendPost(params): Observable<{}> {
    return this.contactUsSendPostWithHttpInfo(params)
        .map((response: Response) => response.json());
}

public contactUsSendPostWithHttpInfo(params): Observable<Response> {
    const path = this.basePath + `/contact-us/send`;

    let queryParameters = new URLSearchParams();
    let headers = new Headers(this.defaultHeaders.toJSON());
    let formParams = new URLSearchParams();
    headers.set('Content-Type', 'application/x-www-form-urlencoded');
    headers.set('Accept', 'application/json');

    if (params.email !== undefined) {
        formParams.set('email', <any>params.email);
    }
    if (params.fullName !== undefined) {
        formParams.set('fullName', <any>params.fullName);
    }
    if (params.question !== undefined) {
        formParams.set('question', <any>params.question);
    }

    let requestOptions: RequestOptionsArgs = new RequestOptions({
        method: RequestMethod.Post,
        headers: headers,
        body: formParams.toString(),
        search: queryParameters
    });

    return this.http.request(path, requestOptions);
}

然后我尝试从服务获取响应，但无法获取响应正文。

this.fqService.contactUsSendPost(formValues).subscribe(
        data => console.log(data ),
        err => console.log(err) <------ 
    );

那么，如何从具有 400 状态码的 http 响应中获取角度 2 的响应正文？

【问题讨论】：

设置参数时为什么要投射？

标签： javascript angular

【解决方案1】：

您只需要在 observable 上捕获错误，请参阅下面的修改代码。

    public contactUsSendPost(params): Observable<{}> {
        return this.contactUsSendPostWithHttpInfo(params)
            .map((response: Response) => response.json())
            .catch(this.handleError);
    }

    public contactUsSendPostWithHttpInfo(params): Observable<Response> {
        const path = this.basePath + `/contact-us/send`;

        let queryParameters = new URLSearchParams();
        let headers = new Headers(this.defaultHeaders.toJSON());
        let formParams = new URLSearchParams();
        headers.set('Content-Type', 'application/x-www-form-urlencoded');
        headers.set('Accept', 'application/json');

        if (params.email !== undefined) {
            formParams.set('email', <any>params.email);
        }
        if (params.fullName !== undefined) {
            formParams.set('fullName', <any>params.fullName);
        }
        if (params.question !== undefined) {
            formParams.set('question', <any>params.question);
        }

        let requestOptions: RequestOptionsArgs = new RequestOptions({
            method: RequestMethod.Post,
            headers: headers,
            body: formParams.toString(),
            search: queryParameters
        });

        return this.http.request(path, requestOptions);
    }

    private handleError (error: Response | any) {
        return Observable.throw(error.code);
    }

【讨论】：

我可以从那个错误对象中获取响应信息（joxi.ru/l2ZM0KES0M8ZmJ）吗？还是只有错误代码和状态？
我相信它将整个错误作为一个对象传递。所以你可以得到错误信息。

【解决方案2】：

您可以升级到HttpClient模块angular 4.3及以上应用，

如果您将整个请求对象作为输入传递给 http.request 方法，您将获得一个完整的响应对象。

【讨论】：