Question

我的应用程序中有一个共享服务来处理身份验证，我试图尽可能地远离http请求抽象我的组件逻辑，但是，我所看到的每一点文档似乎都想要我返回httpClient Observable，并订阅它并执行所有逻辑来处理组件内的结果和错误。

我当前的服务代码已完全损坏，但看起来像这样：

userLogin(email: String, password: String) {
    const body = { email: email, password: password };
    return this.httpClient.post('http://localhost/users/login', body).subscribe(
        this.handleResults,
        this.handleErrors
    );
}

handleResults(results: any) {
    if (results.errors) {
        console.log(results.errors);
    } else {
        return results;
    }
}

handleErrors(err: HttpErrorResponse) {
    if (err.error instanceof Error) {
        // A client-side or network error occurred. Handle it accordingly.
        console.log('A ', err.status, ' error occurred:', err.error.message);
    } else {
        // The backend returned an unsuccessful response code.
        // The response body may contain clues as to what went wrong,
        console.log('Could not connect to server.');
        console.log('Backend returned code ' + err.status + ', body was: ' + JSON.stringify(err.error));
    }
}

理想情况下，在组件模块上，我有一个类似回调函数的东西，当响应准备就绪时调用它。看起来我试图用Angular模式来反对谷物，但与此同时，我无法理解为什么Angular需要对通用http错误进行错误处理，而是在组件级别执行。< / p>

所以我想基本的问题是：我如何处理服务中的httpClient错误，而不是单个组件？

Answer 1

您可以在这里处理错误，并仍然返回observable，如此

return this.httpClient.post('http://localhost/users/login', body).catch(this.handleErrors)

在服务级别处理HttpClient Http错误

1 个答案: