Angular2 RxJs：シンプルなテイク（）のhttpからは観測可能

Question

を返された私は単純にHTTPから.take(5)にしようと、観察返さ：

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

などのようにHTMLでそれを使用します。

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

これは動作します。しかし、私はすべてレコードを取得、私はちょうど5がほしいと思う何が間違っている？ありがとう。 _serviceで

は私が観察可能なHTTPを返す：

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

Answer 1

これ.take(5)はその含むデータのあなたの観察可能ではなく、5つの要素の5つの発するがかかります。

.map機能では5に制限する必要があります。

または.subscribeこの関数では、受信したデータをテンプレートにバインドされるローカル変数に格納することを制限します。あなたのコンポーネントで

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

//

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

this.dataテンプレートにバインドされます。