來自 Angular Redux 存儲的 SwitchMap 結果

Question

我有一個 redux 商店，我在其中保留了一系列值，在這種情況下，合作伙伴看起來像：

partners: [ {id: 1, name: 'partner 1', partnerCode: 'ABC123', ... }, {id: 2, name: 'partner 2', partnerCode: 'CDE567', ...}, ...];

我使用以下方法獲取合作伙伴：

this.store.select('partnerFunc').subscribe(data  => {
  this.partner = data.partners.find(t => t.partnerId === this.id);
});

我希望在得到結果后能夠執行和操作，根據返回的合作伙伴代碼進行 API 調用。

this.dataService.getUsers(partnerCode).subscribe(data => { this.users = data; });

我想我需要使用 switchMap，因為一旦我有我認識的相關合作伙伴想訂閱 redux 商店。 我嘗試了很多組合並在這里到處尋找，但似乎無法弄清楚格式。

這是我想出的最好的嘗試並解釋我正在嘗試做的事情：

this.store.select('partnerFunc').pipe(switchMap(result => {
  return result.partners.find(t => t.partnerId === this.id);
})).subscribe(value => {
  this.dataService.getUsersForPartner(value.partnerId).subscribe(data => {
    this.users = data;
  })
});

但第一行的結果是拋出一個錯誤：

Argument of type '(result: State) => IPartner' is not assignable to parameter of type '(value: State, index: number) => ObservableInput<any>'.

謝謝

Answer 1

這是我根據您所描述的內容和您在此處顯示的代碼的最佳猜測：

this.store.select('partnerFunc').pipe(
  map(result => 
    result.partners.find(t => t.partnerId === this.id)
  ),
  switchMap(({partnerId}) => 
    this.dataService.getUsersForPartner(partnerId)
  )
).subscribe(data => 
  this.users = data
);

高階運算符的重點是它為您管理訂閱，這就是您避免嵌套訂閱的方式（並避免整個 class 可能的錯誤）。 您會在這里注意到您只需要訂閱一次。