Angular6: свойство catch не существует

Question

Я новичок в Angular, и у меня есть базовые знания об этом.Я хочу изучить HttpClient, чтобы я мог создать файл JSON вместо реального сервера.Я создал службу и импортировал HttpClient:

service.ts

import { Injectable } from '@angular/core';
import {HttpClient, HttpErrorResponse} from '@angular/common/http';
import {IEmployee} from "../../../service/src/app/employee";
import {Observable} from "rxjs/index";
import 'rxjs/add/operator/catch';
import 'rxjs/add/observable/throw';

В моем классе EmployeeService я создал метод для получения данных из файла json:

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

  private _url: string = "/assets/data/employees.json";

  constructor(private http:HttpClient) { }

  getEmployee():Observable<IEmployee[]> {
    return this.http.get<IEmployee[]>(this._url)
      .catch(this.errorHandler);
  }

  errorHandler(error: HttpErrorResponse) {
    return Observable.throw(error.message || "Server Error")
  }
}

Но в методе getEmployee я получил следующие ошибки:

ERROR in ./src/app/employee.service.ts
Module not found: Error: Can't resolve 'rxjs/add/observable/throw' in 'E:\Tutorial\NodeJS\WebstormProjects\Angular\http\src\app'
ERROR in ./src/app/employee.service.ts
Module not found: Error: Can't resolve 'rxjs/add/operator/catch' in 'E:\Tutorial\NodeJS\WebstormProjects\Angular\http\src\app'
i ｢wdm｣: Failed to compile.

Как вы можете видеть, я импортировал операторы throw и catch, но я не знаю, почему я получаю ошибки.

Другая проблема, ниже throw method появляется строка из-за устаревших (Deprecated symbol used, consult docs for better alternative) !!Какая альтернатива?

Angular CLI: 6.0.1
Node: 10.0.0
OS: win32 x64
Angular:
...

Package                      Version
------------------------------------------------------
@angular-devkit/architect    0.6.1
@angular-devkit/core         0.6.1
@angular-devkit/schematics   0.6.1
@schematics/angular          0.6.1
@schematics/update           0.6.1
rxjs                         6.1.0
typescript                   2.7.2

****************** РЕДАКТИРОВАТЬ ***************

Я хочу использовать встроенный Observable в Angular, но я не хочу использовать стороннюю библиотеку RXJS для angular.

Это моя папка rx модуля узла, и вы можете видетьв нем наблюдаемый файл.

А в папке node_modules\rxjs\operator есть throw и catch файл .. Но почему он хочет искатьэти файлы в E:\Tutorial\NodeJS\WebstormProjects\Angular\http\src\app папку, которая делает ошибку?

Answer 1

Я исправил свою проблему, установив:

npm install --save rxjs@6 rxjs-compat@6

и использую этот путь для rxjs:

import {Observable, Subject, asapScheduler, pipe, of, from, interval, merge, fromEvent, throwError} from 'rxjs';
import {catchError} from "rxjs/internal/operators";

Кажется, что catch урезан под углом 6, поэтому для того, чтобы я использовал catchError вродениже:

  getEmployee():Observable<IEmployee[]> {
    return this.http.get<IEmployee[]>(this._url)
      .pipe(
        catchError(this.errorHandler));
  }

  errorHandler(error: HttpErrorResponse) {
    return throwError(error.message || "Server Error")
  }

И все ошибки теперь ушли: -)

Answer 2

Импортируйте эти ссылки

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

и затем измените свой код ниже на

getEmployees():Observable<IEmployee[]> {

return this.http.get<IEmployee[]>(this._url).pipe(
catchError(this.errorHandler));
}
errorHandler(error: HttpErrorResponse) {
return observableThrowError(error.message ||"server error");
} 

https://www.youtube.com/watch?v=ScaKGrW5s0I&list=PLC3y8-rFHvwhBRAgFinJR8KHIrCdTkZcZ&index=31

, если вы все еще не понимаете, проверьте ссылку на видео выше

Answer 3

Эти ссылки ниже вам достаточно.удалить ненужные ссылки

import { Injectable } from '@angular/core';
import {HttpClient, HttpErrorResponse} from '@angular/common/http';
import {IEmployee} from "../../../service/src/app/employee";
import {Observable} from "rxjs/Observable";

---

Где, удалены эти ссылки ниже

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

И изменены "rxjs/Observable" вместо "rxjs/index";

Обновление:

Следует проверить папку rxjs с этими файлами, если нет, то ваш пакет что-то пропустил.вам нужно переустановить его.