Warum Filterung das Ergebnis eines beobachtbaren Abonnement als Filterung beobachtbaren sich

Question

ein anderes Ergebnis gibt, gebe ich bin mit diesem Code:

var rx = require('rxjs'); 
var fetch = require('isomorphic-fetch'); 

var urls = [ 
    'http://gundam.wikia.com/api/v1/Navigation/Data' 
]; 

var gundams = rx.Observable 
    .from(urls) 
    .flatMap(x => fetch(x)) 
    .flatMap(x => x.json()) 
    .map(x => x.navigation.wiki) 
    .filter(x => x.text === "Mobile Weapons"); 

gundams.subscribe(
    (n) => console.log(n), 
    (e) => console.log(e), 
    (d) => console.log('done') 
); 

und ich zur Zeit kein Ergebnis an der Konsole angemeldet (mit Ausnahme von ‚getan‘).

Wenn ich die letzte Kette auf meinem beobachtbaren Objekt entfernen (.filter(x => x.text === "Mobile Weapons");) und ändern

(n) => console.log(n),

zu

(n) => console.log(n.filter(x => x.text === "Mobile Weapons")),

ich das erwartete Ergebnis an der Konsole protokolliert werden

[ { text: 'Mobile Weapons', href: '/wiki/Special:RunQuery/Weapon_query', children: [ [Object], [Object], [Object], [Object] ] } ]

Ich bin wahrscheinlich nur Missverständnis, wie Observablen funktionieren, aber ich bin neugierig, wie ich meinen Code ändern kann, um Filter innerhalb des Rückrufs zu verwenden.

Answer 1

Es ist, weil map das Array von Objekten zurückgibt, so empfängt Ihre Filterfunktion das Array und nicht den Inhalt des Arrays, das Sie filtern möchten.

Dies ist der gleiche Grund, der Filter funktioniert, wenn Sie es in abonnieren. Da map das Array von Objekten zurückgibt, können Sie dieses Array filtern und es funktioniert wie erwartet.

Sie müssen flatMap verwenden, damit der Filter die Elemente innerhalb des Arrays anstelle des Arrays empfängt.

var urls = [ 
    'http://output.jsbin.com/qimutofedi.json' 
]; 

var gundams = Rx.Observable 
    .from(urls) 
    .flatMap(x => fetch(x)) 
    .flatMap(x => x.json()) 
    .flatMap(x => x.navigation.wiki) // <--- flatten out the array to emit its values 
    .filter(x => x.text === "Mobile Weapons"); 

gundams.subscribe(
    (n) => console.log(n), 
    (e) => console.log(e), 
    (d) => console.log('done') 
); 

Die oben protokolliert:

Object {text: "Mobile Weapons", href: "/wiki/Special:RunQuery/Weapon_query",children: Array[4]} 
children:Array[4] 
href:"/wiki/Special:RunQuery/Weapon_query" 
text:"Mobile Weapons" 
__proto__:Object 

jsbin example