Abonnieren Sie mehrere Observablen (wie die Verkettung dann() in Verspricht)

Meine Winkel 2 Anwendung 2 Methoden (GetCategories() und GetCartItems()) in einem Dienst , und diese beiden Methoden zurück Observables.

In der Reihenfolge zu berufen, diese zwei Methoden eine nach der anderen von meiner Komponente, die ich geschrieben habe folgenden code:

 ngOnInit() 
{
   this.appService.GetCategories().subscribe( (data) => {
       this.appService.categories = data;


       this.appService.GetCartItems().subscribe( {
                                                    next: (data) => { this.appService.cart = data},
                                                    error: (err) => { this.toaster.error('cart==>' + err)}

                                                })

   });       
}

Grundsätzlich Aufruf GetCartItems() innerhalb subscribe() von GetCategories(), und ich glaube, das ist NICHT der richtige Ansatz. Dies ist eine Art der callback-Hölle.

Jede Idee, wie das umzusetzen, dies in einer besseren Art und Weise (wie die Verkettung then() im Promises)?

InformationsquelleAutor refactor | 2016-12-28
  1. 15

    Sieht aus wie GetCartItems doens ' T hängen GetCategories. Dann können Sie zip:

    Observable
    .zip(
        this.appService.GetCategories()
        this.appService.GetCartItems()
    )
    .catch(err => this.toaster.error(err))
    .subscribe(([categories, cartItems]) => {
        this.appService.categories = categories;
        this.appService.cart = cartItems;
    });
    • Ich denke Observable.combineLatest ist die richtige Wahl, nicht Observable.zip (wenn ich das problem zu verstehen). Dinge haben sich geändert in dem Jahr, seit Sie schrieb. Wenn ich Observable.zip ohne ein drittes argument, wie im obigen Fall, einer der Eingänge ist nicht definiert, je nachdem, Wann das Abonnement geschieht, um das Feuer.
    InformationsquelleAutor Sergey Sokolov
  2. 7

    Dies wird meistens getan mit concat(), concatMap() oder schließlich concatAll() je nach Anwendungsfall und whetrher Sie anrufen müssen beide Leistungen in Ordnung sind oder nicht.

    function GetCategories() {
    return Observable.timer(1000).do(() => console.log('GetCategories()'));
}

function GetCartItems() {
    return Observable.timer(1000).do(() => console.log('GetCartItems()'));
}

console.log('start...');

GetCategories()
  .concatMap(() => GetCartItems())
  .subscribe(() => console.log('done'));

    Diese Drucke auf die Konsole:

    start...
GetCategories()
GetCartItems()
done

    Jedes Element wird verzögert, um zu zeigen, diese sind aufgerufen, um eine nach der anderen.

    Wenn Sie nicht brauchen, um halten die gleiche Reihenfolge, die Sie verwenden können merge() oder mergeMap().

    Siehe live-demo: https://jsbin.com/wawajob/1/edit

    Beachten Sie, dass die Verwendung zip() möglicherweise unerwünschtes Verhalten. Sehen https://github.com/Reactive-Extensions/RxJS/blob/master/doc/api/core/operators/zip.md

    InformationsquelleAutor martin
Schreibe einen Kommentar