Question

我正在使用Angular和Ngrx。我通过许多单独的调用从后端检索大量数据；我的Ngrx存储状态中的2条数据是{ "d": { "results": [ { "FileSystemObjectType": 0, "Id": 1, "Title": "TitleHere", "GoalRange": "3", "Office": "Somewhere", "Role": "FPSL", "IsFilled": false, "Employee": null, "IsActive": true, "Notes": null, "ID": 1, "Attachments": false ...etc和dashboardState.issuesState.issues。

我有以下代码来调用“ setCurrentlySelectedAsset”方法：

dashboardState.defaultAssetId

这有效，每次this.store.pipe( select((state: AppState) => state.dashboard.defaultAssetId), tap((selectedAssetId: number) => this.setCurrentlySelectedAsset(selectedAssetId)) ).subscribe();发出一个值时，就会调用setCurrentlySelectedAsset方法。

但是我只希望在state.dashboard.defaultAssetId有值（即后端请求已完成）的情况下调用此方法。

可能的解决方法是：

dashboardState.issuesState.issues

但是现在this.store.pipe( select((state: AppState) => state.dashboard), tap((dashboardState: State) => { if (dashboardState.issuesState.issues && dashboardState.defaultAssetId) { this.setCurrentlySelectedAsset(dashboardState.defaultAssetId) } }) ).subscribe();上的任何更改都会调用我的tap（那里的很多更改都会被调用）。

有什么想法吗？我已经看过，但是还找不到在dashboardState和select之间插入的可管道运算符，然后如果满足特定条件，即{{ 1}}具有价值。

Answer 1

以下是利用filter operator的解决方案：

this.store.pipe(
  select((state: AppState) => state.dashboard),
  filter((dashboardState: State) => dashboardState.issuesState.issues && dashboardState.defaultAssetId),
  tap((dashboardState: State) => this.setCurrentlySelectedAsset(dashboardState.defaultAssetId))
).subscribe();

如果谓词返回true，则该值将被发射到tap，否则将不被发射。

Answer 2

看看filter。您可以在select和tap之间传送它，并且仅在满足条件时发出。

这是上面链接的描述。

仅通过发出满足指定谓词的项来过滤源发出的项。

所以您可以选择：

this.store.pipe(
      select((state: AppState) => state.dashboard),
      filter(dashboardState => dashboardState.issuesState.issues && dashboardState.defaultAssetId),
      tap(dashboardState => this.setCurrentlySelectedAsset(dashboardState.defaultAssetId))
    ).subscribe();

RXJS-条件管道运算符

2 个答案: