Угловое 6: свойство "catch" не существует по типу "Observable <response> "?

Я обновляю свое приложение до Angular 6. Я модернизируюсь от Angular 4, но приведенный ниже код вызывает ошибки в Angular 6, где он отлично работал в Angular 4.


Ошибки, которые я получаю:

Свойство 'of' не существует для типа typeof Observable '

Ошибка: свойство catch не существует в типе "Observable"

Как разрешить эти ошибки?

  private authInterceptor(observable: Observable<Response>): Observable<Response> {
    return observable.catch((error, source) => {
      if (error.status == 401) {
        this.router.navigateByUrl('/login');
        return Observable.of();
      } else {
        return Observable.throw(error);
      }
    });
  }

Ответ 1

Поскольку вы отметили свой вопрос rxjs6, я предполагаю, что обновление до Angular 6 включает в себя обновление до rxjs6. В этом случае это не работает, потому что методы на наблюдаемом объекте теперь являются автономными операторами, которые вы можете применить с помощью pipe(). Кроме того, импорт изменился. Смотрите руководство по миграции для более подробной информации.

С rxjs6 это должно выглядеть примерно так:

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

private authInterceptor(observable: Observable<Response>): Observable<Response> {
   return observable.pipe(
       catchError( err => {
            if (err.status == 401) {
                this.router.navigateByUrl('/login');
                return EMPTY;
            } else {
                return throwError(err);
            }
       })
   );
 }

Ответ 2

import 'rxjs/add/operator/catch';

Или импортировать Observable таким образом:

import {Observable} from 'rxjs';

Ответ 3

Я предполагаю, что вы перенесли на RXJS6, так как вы также перешли на угловую6.

В RXJS6 используйте catch Error вместо catch, как показано здесь.

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

Ответ 4

Необходимо импортировать оператора улова

import 'rxjs/add/operator/catch';

Ответ 5

вам нужно будет импортировать все используемые вами операторы.

import 'rxjs/add/observable/of';
import 'rxjs/add/observable/throw';
import 'rxjs/add/operator/catch';

Ответ 6

Импортируйте библиотеку следующим способом и измените код

import { catchError } from 'rxjs/operators';
return Observable.pipe(catchError =>...);

Это сработало для меня.

Ответ 7

Это сработало для меня, я использую Angular 6.1.0.

import { Observable, Subject, of } from 'rxjs';
import { switchMap, debounceTime, distinctUntilChanged, catchError } from 'rxjs/operators';

this.ofertas = this.subjectPesquisa // Retorno Oferta[]
  .pipe(debounceTime(1000)) // Executa a ação do switchMap após 1 segundo
  .pipe(distinctUntilChanged()) // Apenas executa a ação switchMap se o termo enviado for outro
  .pipe(switchMap((termo: string) => {

    if (termo.trim() === '') {
      // Retornar um observable de array de ofertas vazio.
      return of<Oferta[]>([]);
    }

    console.log('Requisição HTTP para api: ', termo);
    return this.ofertasService.pesquisaOfertas(termo);
  }))
  .pipe(catchError((err: any) => {
    console.log('Erro: ', catchError);
    return of<Oferta[]>([]);
  }));