Угловой 6 Синтаксис импорта RXJS?

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

У меня было это в 5, и он работал нормально:

import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/catch';
import 'rxjs/add/observable/throw';

Теперь с новым синтаксисом я вижу, что

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

Первые две строки компилируются, но я не могу понять, как получить catch и throw, например. .map() также генерирует ошибку сборки при использовании в коде.

У кого-нибудь есть ссылка на то, как это должно работать?

ОТВЕТЫ

Ответ 1

Из rxjs 5.5 catch была переименована в функцию catchError чтобы избежать столкновения имен.

Из-за наличия операторов, независимых от Observable, имена операторов не могут конфликтовать с ограничениями JavaScript на JavaScript. Поэтому имена изменчивой версии некоторых операторов изменились.

import { catchError } from 'rxjs/operators';

Для throw вы можете использовать ErrorObservable.

import { ErrorObservable } from 'rxjs/observable/ErrorObservable';
ErrorObservable.create(new Error("oops"));

rxjs 6

Вместо ErrorObservable используйте throwError.

 import { throwError } from 'rxjs'
 throwError(new Error("oops"));

Кроме того, теперь вам придется направить операторов вместо того, чтобы напрямую привязывать их к наблюдаемым

Ответ 2

Трубы - это то, что требуется для операторов (операторов), идущих вперёд.

версия: rxjs 6.0.1

Пример:

import { Observable } from "rxjs";
import { map } from "rxjs/operators";

Observable.create((observer: any) => {
    observer.next('Hello')
}).pipe(map((val: any) => val.toUpperCase()))
  .subscribe((x: any) => addItem(x))


function addItem(val: any) {
    console.log('val', val);
}

//output - (In uppercase)
HELLO

Ответ 3

Или, если вы хотите использовать версию 6.0.0 вы делаете

npm я --save rxjs-compat

добавить обратную совместимость

Ответ 4

Запустите эти 2 команды после запуска ng update. Это должно исправить импорт rxjs:

  1. npm я -g rxjs-tslint
  2. rxjs-5-to-6-migrate -p src/tsconfig.app.json

Рекомендации:

Ответ 5

Вам просто нужно импортировать как операторы

import {Observable} из 'rxjs'; import {map, catchError, timeout} из 'rxjs/operator';