Angular2 RxJs: einfach nehmen() von http zurück beobachtbaren

Question

ich einfach zu .take(5) versuchen von einem HTTP-beobachtbaren zurückgegeben:

this.dataObservable = this._service.getData() 
            .take(5); 

und es in HTML verwenden wie so:

<tr *ngFor="let record of dataObservable | async"> 

Dies funktioniert. Aber ich bekomme alle die Aufzeichnungen, ich will nur 5. Was mache ich falsch? Vielen Dank.

Im _service kehre ich die http beobachtbar:

getData(): Observable<any> { 
    url = '/getData'; 
    this._data = this._http.get(url) 
    .map(response => this.extractData(response)); 
    return this._data; 
} 

Answer 1

Diese .take(5) wird 5 aussendet Ihrer beobachtbaren, nicht mehr als 5 Elemente dieser Daten enthält, übernehmen.

Sie sollten es auf 5 in Ihrer .map Funktion begrenzen.

Oder .subscribe zu dieser Observable und in dieser Funktion werden Sie eingehende Daten beschränken, speichern Sie es in einer lokalen Variablen, die an Ihre Vorlage gebunden werden.

getData(): Observable<any[]> { // returns an array, right?? 
    url = '/getData'; 
    this._data = this._http.get(url) 
    .map(response => this.extractData(response)); 
    return this._data; 
} 

// in Ihrer Komponente

this.yourService.getData().subscribe(
    dataArray => this.data = dataArray.slice(0, 5), 
    err => console.log(err) 
); 

this.data wird an Ihre Vorlage gebunden sein.