Wie kann ich eine Sammlung asynchron füllen?

Question

Ich versuche, eine Sammlung von Supermärkten zu bevölkern, indem ich die Produkte asynchron jedem Supermarkt hinzufüge.

Ziel ist es aus mit so etwas passieren: eher wie dieses

[{ 
    name: 'supermarket x', 
    products: [1, 2] 
}] 

Um etwas:

[{ 
    name: 'supermarket x', 
    products: [{ 
     id: 1, 
     name: 'cacao' 
    }, { 
     id: 2, 
     name: 'milk' 
    }] 
}] 

ich die Basis-Code für diese machen habe, aber ich kann nicht erreichen füllen der erste Stream mit dem zweiten, sobald er fertig ist.

Irgendwelche Ideen?

ich hier eine JSBin mit der Struktur lassen, um es Ihnen

https://jsbin.com/nucutox/1/edit?js,console

Dank schneller zu machen!

Answer 1

So haben Sie eine getSupermarkets() Funktion, die einen Stream zurückgibt, der mehrere Supermarktobjekte und eine getProduct(id)-Funktion ausgibt, die einen Stream zurückgibt, der ein einzelnes Produkt mit der angegebenen ID ausgibt und dann vervollständigt. Und Sie wollen einen Strom von Supermärkte ids zu einem Strom von Supermärkten enthalten Produkt abzubilden „aufgelöst“ Produkt-Objekte enthält. Habe ich das richtig verstanden?

Hier ist meine Lösung:

const supermarkets$ = getSupermarkets() 
    .concatMap(supermarket => { 
     const productStreams = supermarket.products 
      .map(productId => getProduct(productId)); 

     return Rx.Observable.combineLatest(productStreams) 
      .map(products => Object.assign({}, supermarket, { products })); 
    }); 

supermarkets$.subscribe(x => console.log(x)); 

Wenn ein neuer Supermarkt Objekt kommt, wir zuerst seine Reihe von Produkt-IDs zu einer Reihe von Produkt-Observablen Karte, das heißt Array<Id> => Array<Observable<Product>>. Dann geben wir das Array zu einer combineLatest Operator, der wartet, bis jeder der Observablen einen Wert erzeugt und emittiert eine Reihe von diesen Werten, das heißt eine Reihe von Produkt Objekten. Dann erzeugen wir ein neues Supermarkt-Objekt mit products auf das Array gesetzt. Wir wollen das ursprüngliche supermarket Objekt unverändert lassen, deshalb Object.assign.

Um es ich zu machen arbeiten musste leicht Ihre Implementierung von getProduct() aktualisieren: Verwenden Sie .of(product) Operator statt .from(product) als product ist ein einfaches Objekt, das wir emittieren wollen.