Angular 2+ http get() JSON-Daten. Kann nicht .filter Daten

Question

Ich habe eine service.ts, wo ich die get() Methode (http) verwenden, um Daten aus einer lokalen JSON-Datei zu erhalten. Es funktioniert gut.

getMusic() { 
    return this.http.get('assets/music.json') 
.map((res:Response) => res.json()) 

In meiner Klasse habe ich meine 'suscribe':

ngOnInit() {this.musicService.getMusic().subscribe(
data => { this.music = data.music} 
); 
} 

Meine JSON-Datei sieht wie folgt aus:

{ 
"music" : [ 
    { 
     "no": 11, 
     "name": "Music 1", 
    }, ...... aso.... 

Alles perfekt. Nun, ich versuche nun meine Daten zu filtern, so dass nur Musik mit no = 11 angezeigt wird.

Ich habe diese Importe:

//import 'rxjs/add/operator/map'; 
//import 'rxjs/add/operator/filter'; 
import 'rxjs/Rx'; 

ich mehrere Dinge ausprobiert haben. Einschließlich Filterung für eine Zahl anstelle einer Zeichenfolge, wobei == anstelle von === verwendet wird, um .filter innerhalb oder außerhalb von .map usw. einzufügen. Wenn ich das versuche, erhalte ich überhaupt kein Ergebnis. Ich bekomme keine Fehler, nur kein Ergebnis:

getMusic() { 
    return this.http.get('assets/music.json') 
    .map((res:Response) => res.json()) 
    .map(x => x.filter(y => y.name === 'Music 1')); 
} 

Answer 1

Sie haben falsche filter Operatorfunktion. Es sollte auf music gefiltert werden.

getMusic() { 
    return this.http.get('assets/music.json') 
    .map((res:Response) => res.json()) 
    //filter on `music` object instead of `x` directly 
    .map(x => x.music.filter(y => y.name === 'Music 1')); 
} 

Answer 2

filter die Funktion einer Anordnung mit einer Instanz nicht davon

Verwendung versuchen angewendet wird

this.filteredArr = this.music.filter(x=>x.name == 'music 1'); //some condition