web-dev-qa-db-fra.com

import .of () pour Observable en tapuscrit

J'utilise ce grand référentiel pour mon angular 2 (TypeScript) - https://github.com/qdouble/angular-webpack2-starter . Et J'ai besoin d'utiliser Observable.of (..) . Lorsque j'essaie de l'importer:

import { Observable } from "rxjs/Observable";
import { of } from 'rxjs/observable/of';

Je reçois:

La propriété 'of' n'existe pas sur le type 'typeof Observable'.

Je l'ai également essayé de la manière suivante:

import { Observable } from "rxjs/Observable";
import { of } from 'rxjs/add/observable/of'; // notice 'add'

J'ai eu:

node_modules/rxjs/add/observable/of "'n'a pas de membre exporté' of '.

Alors, comment peut-on importer cette méthode statique Of () pour Observable ???

angulartypescriptrxjs5
16
alvipeo

Vous n'avez pas besoin d'importer {of} de 'rxjs/add/observable/of'. Vous pouvez utiliser directement

import { Observable } from "rxjs/Observable";
import "rxjs/add/observable/of";

Ou vous pouvez importer Observable depuis "rxjs/Rx" qui regroupe tous les opérateurs.  Mauvaise pratique 

import { Observable } from "rxjs/Rx";

Mise à jour 2018-01-26: RxJS v5.5 + opérateurs canalisables

De https://github.com/ReactiveX/rxjs/blob/master/doc/pipeable-operators.md

À partir de la version 5.5, nous avons fourni des "opérateurs canalisables", accessibles dans rxjs/operators (notez les "opérateurs" pluralisés). Celles-ci sont censées être une meilleure approche pour extraire uniquement les opérateurs dont vous avez besoin que les opérateurs "patch" trouvés dans rxjs/add/operator/*.

Maintenant que les importations de "correction" vont être dépréciées, il serait préférable d'utiliser des importations strictes.

import { of as observableOf } from 'rxjs/observable/of'

et l'utiliser comme ça

const myObs$: Observable<number> = observableOf(1, 2, 3)
22
Noémi Salaün

RxJS 6

À partir de RxJS 6 , les importations ont été grandement simplifiées et causent maintenant moins de confusion grâce à une plus surface API intuitive:

  1. Les méthodes de création comme of sont directement importées de 'rxjs':

    import { of } from 'rxjs';

  2. Tous les tuyaux opérateurs sont importés de 'rxjs/operators', par exemple.:

    import { tap, map } from 'rxjs/operators';

Migration:

Si vous effectuez une mise à jour directement à partir de RxJS 5, vous pouvez même utiliser les règles TSLint pour RxJS, qui corrigeront automatiquement vos importations vers la nouvelle API simplifiée:

  1. npm i -g rxjs-tslint
  2. rxjs-5-to-6-migrate -p [path/to/tsconfig.json]
14
Mobiletainment