如何解决 angular 8 中 Observable 中的 catch 错误？

Question

我编写了错误处理程序代码，但我在 catch 中遇到了错误。未定义的方法。

这是我的 serivce.ts 代码。

import { Injectable } from "@angular/core";
import { HttpClient, HttpErrorResponse } from "@angular/common/http";
import { user } from "./user";
import { Observable } from "rxjs";
import "rxjs/add/operator/catch";
import "rxjs/add/Observable/throw";
@Injectable({
  providedIn: "root"
})
export class DemoService {
  private url: string = "/assets/demo/user.json";
  constructor(private http: HttpClient) {}

  getuserdetails(): Observable<user[]> {
    return this.http.get<user[]>(this.url).catch(this.errorHandler);
  }
  errorHandler(error: HttpErrorResponse) {
    return Observable.throw(error.message || "server error.");
  }
}

这是我的app.component.ts文件代码

 public userdetails = [];
  public errorMsg;
  constructor(private user: DemoService) {}
  ngOnInit() {
    this.user
      .getuserdetails()
      .subscribe(
        $data => (this.userdetails = $data),
        error => (this.errorMsg = error)
      );
  }

我在捕获时出错。并且错误消息是属性 'catch' 在类型 'Observable' 上不存在。

Answer 1

在 observable 上捕获错误的最佳方法是：

this.http.get<user[]>(this.url).pipe(
   tap(),
   catchError(err => { return this.errorHandler(err) }
)

如果 this.http.get() 是一个 Promise，就像您在代码 .catch(...) 中所做的那样，就可以了。尝试在管道末尾或 finalize(..) 之前使用 catchError(...)（如果您使用它）。

在 Observables 没有 .pipe() 和你之前，像 Promises 中的链接操作，所以他们将名称 .then() 更改为我认为 flatMap() 并将 .catch() 更改为 catchError() 所以程序员知道它是 Observable 还是 Promise。

Answer 2

您可以在 rxjs/operators 中使用 catchError。尝试如下。

import { catchError } from 'rxjs/operators';

export class DemoService {

    getuserdetails(): Observable<user[]> {
        return this.http.get<user[]>(this.url)
            .pipe(catchError(this.errorHandler))
    }
    errorHandler(error: HttpErrorResponse) {
        return Observable.throw(error.message || "server error.");
    }
}

Answer 3

import { Observable, throwError } from 'rxjs';
import { catchError, } from 'rxjs/operators';

return this.http.get<user[]>(this.url).pipe(catchError(this.errorHandler))

errorHandler(error: HttpErrorResponse) {
    return throwError(error.message || "server error.");
}

Answer 4

在最后一个版本的 rxjs 中你应该使用：

return return this.http.get<user[]>(this.url)
                  .subscribe((r:Author) => console.log("GOOD"),
                                    err => console.log("ERROR))

Answer 5

https://rxjs.dev/deprecations/subscribe-arguments

你应该做的：

source$.subscribe({ next: doSomething, error: doSomethingElse, complete: lol }).

根据最新文档

如何解决 angular 8 中 Observable 中的 catch 错误？

How to solve catch error in Observable in angular 8?

typescript

angular

angular8