角度2 - Observableが戻り値を更新する

Question

戻り値を更新して、完了時に表示する方法を教えてください。

は、それがこのようなHTMLから呼び出されている

：

subscribeItemsForUsername(username: string): Observable<Item[]> { 
     let returnedList = this.af.database.list('users', { 
     query: { 
      orderByChild: 'username', 
      equalTo: username, 
     } 
    }); 

    return returnedList; 
    } 

Answer 1

非同期パイプ

参考使用することにより：https://angular.io/docs/ts/latest/guide/pipes.html#async-pipe

変更をここで

// the item.username is from a higher loop which works. 
<div *ngFor="let eqItem of getTest(item.username)"> 



getTest(username: string): Item[] { 
let itemArray: Item[]; 
this.usersService.subscribeItemsForUsername(username).subscribe(z => { 
    itemArray = z; 
    //return z; 
}); 
return itemArray; 
} 

はサービスです見る：

<div *ngFor="let eqItem of getTest(item.username) | async"> 

とgetTest方法は、観察などを返す必要があります：

getTest(username: string): Observable<Item[]> { 
    return this.usersService.subscribeItemsForUsername(username).map(res=> res.json()); 
} 

Answer 2

あなたが購読メソッドにパラメータとして送信機能は、将来的に呼ばれるコールバックです。 getTestメソッドが彼の仕事を終了した後に呼び出される可能性があります。itemArray = zしかし、itemArrayは現時点でexsistではありません。

ビュー内の行<div *ngFor="let eqItem of getTest(item.username)">が<div *ngFor="let eqItem of []">と同等ですThatsなぜ（購読方法であなたのコールバックはgetTestメソッドが終了した後

ソリューションexcuteうとします。

を@echonaxが述べたように、Asyncがされます最善の解決策要するに

<div *ngFor="let eqItem of getTest(item.username) | async"> 

getTest(username: string):Observable<Item[]>{ 
return this.usersService.subscribeItemsForUsername(username); 
} 

：非同期パイプが加入しunsubsribe（コンポーネントはdestoryedされるべき後）およびtが返されますo ngForアレイ（この場合）。