如果NgRx状态已经有Angular中的数据，如何停止NgRx效果

Question

我正在使用 #angular ngrx 进行 http 调用以将数据存储在状态中。现在，如果 ngrx 状态已经使用 RxJ（如 takeuntil 等）拥有数据，我想停止标注。 有人可以帮我举个例子吗？

在下面的代码中我无法停止http标注。

@Effect()
  fetchShippingContacts$: Observable<Action> = this.actions$
    .ofType<picklistActions.RetrieveShippingContacts>(picklistActions.PicklistActionTypes.RetrieveShippingContacts)
    .map((action: picklistActions.RetrieveShippingContacts) => null)
    .withLatestFrom(this.store$)
    .switchMap(() => {
      const nextSearch$ = this.actions$.ofType(picklistActions.PicklistActionTypes.RetrieveShippingContacts).skip(1);
      return this.vf.callRemoteAction([],
        environment.getShippingContacts.class,
        environment.getShippingContacts.method, true)
        .takeUntil(nextSearch$)
        .switchMap((response) => {
          console.log('response => ', response);
          return [
            new picklistActions.RetrieveShippingContactsComplete(shippingContactsPayloadParser(response.vfResponse.payloadMap.records)),
            new applicationActions.HideLoadingAllAction()
          ];
        })
        .catch((err) => from([
          new applicationActions.HideLoadingAllAction()
        ]));
    });

我尝试使用 takeUntil 停止调用，但使用它我也无法停止调用。

期望：

第一次效果应该被调用并且 ngrx 状态将会更新。如果 Action 被重新触发并且 state 已经有数据，则不要进行 http 调用或停止效果。

Answer 1

做一点不同的事情会让这更容易。 如果您不想在存储中已有数据时执行效果，可以使用

filter

忽略该操作。

有关更多信息，请参阅https://timdeschryver.dev/blog/start-using-ngrx-effects-for-this#enhance-your-action-with-global-store-state

detail = createEffect(() => {
  return this.actions.pipe(
    ofType(ProductDetailPage.loaded),
    concatLatestFrom(() => this.store.select(selectProducts)),
    // 👇 ignore if state is already in the store
    filter(([{ payload }, products]) => !!products[payload.sku]),
    mergeMap(([{payload}]) => {
      ...
    })
  )
})