1

将库更新到新的 Angular 6 和 RxJS 6 后，我遇到了问题。

我有RouteService作为服务工作的课程。它用于HttpClient从远程 API 获取数据。更新后，当我尝试编译项目时遇到一些奇怪的错误。

这是我的服务类：

import {Injectable} from '@angular/core';
import {HttpClient} from "@angular/common/http";
import {Observable} from "rxjs/Rx";
import {catchError} from 'rxjs/operators';

export interface Route {
    name:string;
    route_id:number;
    created_at:Date;
}

@Injectable()
export class RouteService {
    constructor(private http:HttpClient) {}

    getRoutesList():Observable<Route[]> {
        return this.http.get<Route[]>(`http://localhost:8090/api/routes`)
        .pipe(catchError(ServiceUtil.handleError));
    }
}

这是handleError方法：

import {HttpErrorResponse} from '@angular/common/http';
import {ErrorObservable} from 'rxjs/observable/ErrorObservable';

export module ServiceUtil {
    export function handleError(error:HttpErrorResponse) {
        if (error.error instanceof ErrorEvent)
        console.error('An error occurred:', error.error.message);
        else 
        console.error('An error occurred:', JSON.stringify(error.error));    
        return new ErrorObservable(error.error);
    }
}

在ng serve我收到错误后：

ERROR in src/app/service/route-service/route.service.ts(21,5): error TS2322: Type 'Observable<{} | Route[]>' is not assignable to type 'Observable<Route[]>'.
Type '{} | Route[]' is not assignable to type 'Route[]'.
    Type '{}' is not assignable to type 'Route[]'.
    Property 'includes' is missing in type '{}'.

Failed to compile.

我究竟做错了什么？我的代码是否有问题导致新版本出错但在旧版本中工作？还是有什么改变？

4

3 回答 3

0

正如错误所说。

将您的方法声明更改为：

getRoutesList():Observable<Route[] | {}>
于 2018-05-07T12:13:16.760 回答
0

某处用户的getRoutesList意料之外Route[]。

getRoutesList(): Observable<any>

或将您的错误handlerError返回更改为

return Observable.throw(error.error)
于 2018-05-07T12:26:03.047 回答
0

我已经按照@Riscie的建议使用了 http 拦截器并且它正在工作。

这是我的代码的一部分：

export class AngularInterceptor implements HttpInterceptor {
    intercept(req:HttpRequest<any>, next:HttpHandler):Observable<HttpEvent<any>> {
        return <any>next.handle(req)
        .pipe(timeout(5000), tap(event => {}, error => {
            if(error == null)
                throw {"message": "Unknown server error", "code": 987};
            else if(error.error != null) {
                if(error.error.code != null)
                    throw error.error;
                else if(error.status != null)
                    throw "message": error.error.error, "code": error.status};          
            }
            else
                throw {"message": error+"", "code": 986}
        }));
    }
}

现在正确吗？

于 2018-05-11T22:23:52.607 回答