代码之家  ›  专栏  ›  技术社区  ›  Adam

服务中错误处理程序声明的基本角度语法问题

  •  0
  • Adam  · 技术社区  · 6 年前

    在经历 Angular tutorial 将其转换为我的目的,我决定将显示的两种错误处理程序方法组合为一种,因为我喜欢这两种方法的功能。

    这都是一个服务,这是本教程中的两种方法:

      private handleError1(error: HttpErrorResponse) {
        if (error.error instanceof ErrorEvent) {
          console.error('An error occurred', error.error.message);
        } else {
          console.error(`Backend error code ${error.status}`, 
            `body: ${error.error}`);
        }
        return throwError('Something bad happened');
      }
    

    像这样叫的,在哪里 Group 我的类是否来自REST服务器:

      getGroups(): Observable<Group[]> {
        return this.httpClient.get<Group[]>(`${this.restUrl}/group`).pipe(
            tap(_ => this.log(`fetched groups`)),
            catchError(this.handleError1)
          );
      }
    

    另外,还有:

      private handleError2<T>(operation = 'operation', result?: T) {
        return (error: any): Observable<T> => {
          console.error(`${operation} failed!`, error);
          return of(result as T);
        }
      }
    

    这叫做:

      getGroups(): Observable<Group[]> {
        return this.httpClient.get<Group[]>(`${this.restUrl}/group`).pipe(
            tap(_ => this.log(`fetched groups`)),
            catchError(this.handleError2<Group[]>('getGroups', []))
          );
      }
    

    所以我天真地将组合错误处理程序组合在一起:

    private handleError<T>(error: HttpErrorResponse, 
                       operation = 'operation', result?: T) {
    ....
    

    但是我有问题,因为我不知道如何在 catchError() . 那 HttpErrorResponse 当它是唯一的参数时,显然是隐含的,但是如何呢?

    1 回复  |  直到 6 年前
        1
  •  1
  •   DeborahK    6 年前

    我在这方面花了更多的时间。

    首先,我确保我有最新版本的打字稿。我的项目使用3.1.1。

    这是我的方法:

      getProducts(): Observable<Product[]> {
        return this.http.get<Product[]>(this.productUrl).pipe(
          tap(data => console.log('All: ' + JSON.stringify(data))),
          catchError(error => this.handleError<Product[]>(error, 'get', [] ))
        );
      }
    

    这是我的错误处理程序:

      private handleError<T>(err: HttpErrorResponse, operation = 'operation', result?: T) {
        // in a real world app, we may send the server to some remote logging infrastructure
        // instead of just logging it to the console
        let errorMessage = '';
        if (err.error instanceof ErrorEvent) {
          // A client-side or network error occurred. Handle it accordingly.
          errorMessage = `An error occurred: ${err.error.message}`;
        } else {
          // The backend returned an unsuccessful response code.
          // The response body may contain clues as to what went wrong,
          errorMessage = `Server returned code: ${err.status}, error message is: ${err.message}`;
        }
        console.error(errorMessage);
        return throwError(errorMessage);
      }
    

    这段代码没有任何编译错误。

    我甚至在tsconfig.json中打开了严格模式:

    "strict": true,
    

    它仍然没有语法错误。

    我在这里建立了一个Stackblitz: https://stackblitz.com/edit/angular-simple-retrieve-deborahk

    如果你看不到同样的结果,请告诉我。