我有一个完美运行的代码(并且仍然运行完美)。当我从 angular 7 升级到 angular 8 时,我的 Visual Studio 代码开始显示 HttpClient.get 方法的错误。
错误出现在 HttpClient.get 方法的 catch 部分。代码编译良好并且工作正常。我检查了角度示例,一切看起来都正确。我不确定为什么编辑器显示问题。
getLaborStats(dt: string, hotelId: string): Observable<LaborStats> {
let lastDayLaborURL = HelloGMVars.varServiceURL + 'laborstats' ;
const options = { headers: new HttpHeaders().append('AccessToken', this.accessToken)};
return this.httpC.get<LaborStats>(lastDayLaborURL + '/' + hotelId + '/' + dt, options)
.pipe(
catchError(this.handleError('getLastDayLabor', null))
);
}
这是我的编辑器显示的错误 -
"[ts]
Type 'Observable<LaborStats | Observable<any>>' is not assignable to type 'Observable<LaborStats>'.
Type 'LaborStats | Observable<any>' is not assignable to type 'LaborStats'.
Type 'Observable<any>' is not assignable to type 'LaborStats'.
Property 'today' is missing in type 'Observable<any>'.
(method) Observable<LaborStats>.pipe<LaborStats | Observable<any>>(op1: OperatorFunction<LaborStats, LaborStats | Observable<any>>): Observable<LaborStats | Observable<any>> (+10 overloads)
"
如果我删除 .pipe 部分,那么错误就会消失。所以,它告诉我 catchError 部分有问题。
这是我的错误处理程序 -
import { Injectable } from '@angular/core';
import { HttpErrorResponse } from '@angular/common/http';
import { Observable , of } from 'rxjs';
import { MessageService } from './message.service';
import { OktaAuthService } from './services/okta-auth.service';
/** Type of the handleError function returned by HttpErrorHandler.createHandleError */
export type HandleError =
<T> (operation?: string, result?: T) => (error: HttpErrorResponse) => Observable<T>;
/** Handles HttpClient errors */
@Injectable()
export class HttpErrorHandler {
constructor(private okta: OktaAuthService, private messageService: MessageService) { }
/** Create curried handleError function that already knows the service name */
createHandleError = (serviceName = '') => <T>
(operation = 'operation', result = {} as T) => this.handleError(serviceName, operation, result);
/**
* Returns a function that handles Http operation failures.
* This error handler lets the app continue to run as if no error occurred.
* @param serviceName = name of the data service that attempted the operation
* @param operation - name of the operation that failed
* @param result - optional value to return as the observable result
*/
handleError<T> (serviceName = '', operation = 'operation', result = {} as T) {
return (error: HttpErrorResponse): Observable<T> => {
// TODO: send the error to remote logging infrastructure
console.error(error); // log to console instead
const message = (error.error instanceof ErrorEvent) ?
error.error.message :
`server returned code ${error.status} with body "${error.error}"`;
// TODO: better job of transforming error for user consumption
this.messageService.add(`${serviceName}: ${operation} failed: ${message}`);
if (error.status === 401) {
console.log('401 returned so logging out') ;
this.okta.logout() ;
}
// Let the app keep running by returning a safe result.
return of( result );
};
}
}