角度2 ngrx /ストア私はRxjsを学び、理解しようとngrx /店舗</p> <p>よ別の観察可能なサービスコール

Question

の結果上で観察サービスコールを呼び出す私は2つのAPI呼び出しを持って、最初のものは、私を取得文字の名前の配列、私は文字の在庫を取得します。

ngrx/storeアクション/レジューサー/エフェクトを使用して、最初の関数によって返された配列を通じて2番目の関数を実行するにはどうすればよいですか？これは減速である

public loadCharacters(): Action { 
    return { 
    type: Gw2Actions.LOAD_CHARACTERS 
    }; 
} 

public loadCharactersSuccess(characters: Character[]) { 
    return { 
    type: Gw2Actions.LOAD_CHARACTERS_SUCCESS, 
    payload: characters 
    }; 
} 

：

public getCharacterNames(): Observable<string[]> { 
    return this._http.get(this._url + '/characters?access_token=' + this._key) 
    .map((res: Response) => res.json()) 
    .catch((error: any) => Observable.throw(error.json().error || 'server error')); 
} 

public getCharactersInventory(characterName: string): Observable<Bag[]> { 
    return this._http.get(this._url + '/characters/' + encodeURI(characterName) + '/inventory?access_token=' + this._key) 
    .map((res: Response) => res.json()) 
    .catch((error: any) => {return Observable.throw(error.json().error || 'server error'); }); 
} 

これらのアクションは、次のとおりです。

case Gw2Actions.LOAD_CHARACTERS_SUCCESS: { 
    return action.payload; 
    } 

そして、これは私が使ってみた効果である

これは、サービス機能のとおりです。

@Effect() private loadCharacters$: Observable<Action> = this._actions$ 
    .ofType(Gw2Actions.LOAD_CHARACTERS) 
    .map((action) => action.payload) 
    .switchMap(() => this._gw2Service.getCharacterNames()) 
    .map((characterNames) => { 
     let characters = []; 
     characterNames.forEach((characterName) => { 
     let characterBags = this._gw2Service.getCharactersInventory(characterName) 
      .subscribe((res) => res); 
     characters.push({ 
      name: characterName, 
      bags: characterBags 
     }); 
     }); 
     return characters; 
    } 
) 
    .map((characters: Character[]) => this._gw2Actions.loadCharactersSuccess(characters)); 

Answer 1

Rxjsとngstoreの2つの課題を分けることをお勧めします。これは、文字の名前からインベントリを解決するアプローチです。うまくいけば、それをngstoreエフェクトにマップすることができます。

let charNames$ = Rx.Observable.of([{name: 'a'}, {name: 'b'}, {name: 'c'}]); //mock names 
 
let getInventoryFromName = name => Rx.Observable.of({owner: name}).delay(1000); //mock inventory 
 

 
let result$ = charNames$.switchMap(names => Rx.Observable.forkJoin(names.map(n => getInventoryFromName(n.name)))); 
 

 
result$.subscribe(res => console.log('got some inventory/user pairs: ', res));

<script src="https://unpkg.com/rxjs/bundles/Rx.min.js"></script>