rxjs@6.3.3 的 rxjs catchError 导入问题

Question

尝试为 rxjs v6.3.3 导入 catchError，但导入看起来不起作用。我在使用 catch 时遇到错误。

找到了类似的问题，但看起来 none 帮助了我。

代码：

import { Injectable } from '@angular/core';
import { HttpClient, HttpErrorResponse } from '@angular/common/http';
import { IWinServices } from './WinServices';
import { Observable } from 'rxjs';
import { catch } from 'rxjs/operators';

@Injectable({
  providedIn: 'root'
})
export class WinServicesService {

  private _url : string = './assets/Data/WinServicess.json'
  constructor(private http: HttpClient) { }

  getWinServices() :Observable <IWinServices[]>  {
      return this.http.get<IWinServices[]>(this._url).catch (this.errorHandler);

  }

  errorHandler(error: HttpErrorResponse) {

    return Observable.throw(error.message || "Server Error");
  }
}

尝试了可能的解决方案： None 对我有效

import { catchError } from 'rxjs/operators';
import 'rxjs/add/operator/catch';
import {Observable} from 'rxjs/Rx';

错误：

Property 'catch' does not exist on type Observable<IWinServices[]>'.ts(2339)
ERROR in src/app/employee.service.ts(16,52): error TS2339: Property 'catch' does not exist on type 'Observable<IEmployee[]>'

Answer 1

错误说明了问题。

error TS2339: Property 'catch' does not exist on type 'Observable<IEmployee[]>'

在 rxjs v6+ 中，您不再将运算符链接到可观察调用上。

相反，试试这个...

像下面这样导入import { catchError } from 'rxjs/operators';

像这样将 catchError 管道化。


return this.http.get<IWinServices[]>(this._url).pipe(
    catchError(() => {
       // error handling logic here
    })
)

查看这个很棒的网站以供参考。 https://www.learnrxjs.io/operators/error_handling/catch.html

最后说明：不要使用这个 import 'rxjs/add/operator/catch'; 不推荐使用它，因为它不是作用域导入。

希望对您有所帮助。

rxjs@6.3.3 的 rxjs catchError 导入问题

rxjs catchError import issue for rxjs@6.3.3

rxjs

typescript

visual-studio-code

angular

rxjs6