Winkel 6 RXJS Import-Syntax?

Bin ich bei der Migration eines Winkel-5-app auf die neueste CLI und Eckig 6 RC und alle meine Beobachtbaren Importe sind gebrochen. Ich sehe, dass Winkel 6 ändert sich die Art und Weise der Importe funktionieren, aber ich kann nicht finden, eine genaue Referenz, wie die syntax funktioniert.

Hatte ich das in 5 und es hat funktioniert:

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

Nun mit der neuen syntax, die ich sehen, dass 

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

Den ersten beiden Zeilen zu kompilieren, aber ich kann nicht herausfinden, wie man fangen und werfen zum Beispiel. .anzeigen() wirft eine build-Fehlermeldung, wenn im code verwendet.

Jemand einen Verweis auf, wie dies funktionieren soll?

Nicht sicher, ob das, was Sie Fragen, aber Sie brauchen, um zu refaktorieren den code selbst, wenn Sie es noch nicht getan. Es ist die neue pipe syntax. So etwas wie z.B. yourObservable$.pipe(map(val => val * 2)).subscribe(). Also mit dieser Art von import Sie nicht verwenden yourObservable$.map(blah). Hier einige Referenz: blog.angularindepth.com/...
Siehe github.com/ReactiveX/rxjs/blob/master/doc/pipeable-operators.md

InformationsquelleAutor Rick Strahl | 2018-04-13

  1. 20

    Vom rxjs 5.5, catch umbenannt wurde, um catchError Funktion zu vermeiden-name-clash.

    Durch die Betreiber zur Verfügung-unabhängig von einer Beobachtbaren, Bediener-Namen dürfen nicht in Konflikt mit dem JavaScript-Schlüsselwort Einschränkungen. Daher die Namen der pipeable version einige Betreiber haben sich geändert. 

    import { catchError } from 'rxjs/operators';

    Für throw können Sie ErrorObservable.

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

    rxjs 6

    Statt ErrorObservable verwenden throwError.

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

    Auch Sie nun die Leitung der Operatoren statt direkt Verkettung Sie sich zu den beobachtbaren

    werfen hat jetzt einen neuen Namen, d.h. throwError und importieren Sie es so auf: import { throwError } aus 'rxjs';
    danke @rgantla aktualisiert meine Antwort
    Nicht den Import von 'rxjs' bringen über das gesamte Modul? Was ist die spezifische Pfad für den import?
    nicht in die Falle von rxjs v6. Anscheinend haben Sie geändert nach dieser

    InformationsquelleAutor Suraj Rao

  2. 10

    Rohre sind, was erforderlich ist, für die Betreiber(N) für die Zukunft.

    version: rxjs 6.0.1

    Beispiel:

    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

    InformationsquelleAutor Dash

  3. 5

    Oder wenn Sie wollen, zu halten, die mit der version 6.0.0 Sie

    npm i --save rxjs-compat

    hinzufügen reverse-Kompatibilität

    Sieht aus wie Sie tun können, ng das upgrade zu bekommen, dass automatisch Hinzugefügt (zusammen mit einer Aktualisierung der Winkel-Projekt, Referenzen, neueste version).
    Es gibt keine ng upgrade Befehl. ng update du meinst, es nicht das Paket hinzufügen

    InformationsquelleAutor Pian0_M4n

  4. 4

    Laufen diese 2 Befehle nach dem ausführen ng update. Dies sollte fix die rxjs Importe:

    1. npm i-g rxjs-tslint
    2. rxjs-5--6-Migration -p src/tsconfig.app.json

    Referenzen:

    Wie bekommt man rxjs-5-to-6-migrate in eine PATH-variable? Nachdem ich laufen npm i -g rxjs-tslint, und führen Sie dann rxjs-5-to-6-migrate bekomme ich rxjs-5-to-6-migrate is not recognized as an internal or external command

    InformationsquelleAutor user8152243

  5. 0

    Brauchen Sie nur den import der like-Operator 

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

    InformationsquelleAutor vishal

Schreibe einen Kommentar