时间戳

首页 > 解决方案 > TypeScript 3.1.6 Angular 7 Rxjs6 使用 catchError 在编辑器中显示错误，但代码运行正确

angular - TypeScript 3.1.6 Angular 7 Rxjs6 使用 catchError 在编辑器中显示错误，但代码运行正确

问题描述

如果发生错误，我正在尝试从数据服务返回自定义错误。

public getRoles(): Observable<Array<Role> | CustomError> {

    return this.http.get(this.urlService.getRoles)
        .pipe(
            map((res: any) => {
                    let roles = new Array<Role>();
                    res.Result.forEach(item => {
                        roles.push(new Role().fromItem(item));
                    });

                    return roles;
                }
            ),
            catchError(err => {
                let customError = new CustomError();
                customError.errorNumber = err.status;
                customError.message = err.message;
                return throwError(customError);
            })
        );
}

上面的代码确实按我的预期运行，但文本编辑器显示以下错误：

(TS) 类型'可观察的<{} | Role[]>' 不可分配给类型 'ObservableRole[] | 自定义错误>'。

输入'{} | Role[]' 不可分配给类型 'Role[] | 自定义错误'。

类型 '{}' 不可分配给类型 'Role[] | 自定义错误'。

类型“{}”不可分配给类型“CustomError”。

类型“{}”中缺少属性“errorNumber”

谁能告诉我我需要做什么来解决这个问题？

事实证明，这不是代码中我遇到 catchError 问题的唯一地方。我有一个简单的拦截器，可以将 http 错误记录到控制台。（我正在试验如何使用拦截器）。

public intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    console.log(`ErrorInterceptor - ${req.url}`);

    return next.handle(req)
        .pipe(catchError(err => {
            console.log(err);
            return throwError(err);
        }));
}

通过这段代码，我得到了一组非常相似的消息。我是否正确使用了 catchError 和 throwError ？

标签： angularangular7rxjs6typescript3.0

解决方案

我的，你需要导入 throwError 类吗？：

import {Observable, throwError} from 'rxjs';

推荐阅读