Question

@effect()
public loadAccommodations$: Observable = this.actions$
  .ofType(PAA.PROPERTY_LOAD_REQUEST)
      // .debounce(300) 
      // introducing this mitigates the flood but does not resolve the issue
  .switchMap((action: Action) => {
     return this.propertyAccommodationsService.loadAccommodations(action.payload.id)
      .takeUntil(this.loadAccommodations$)
      .map((response: IResponseSuccess) => PAA.loadSuccess(action.payload, response))
      .catch((error: Error) => {
         const errorNotification = errorNotificationFactory(error.message);
         this.notificationService(errorNotification)
         return of( PAA.loadFailure() );
    });
  });

仅在我的效果多次拦截此操作后调度PAA.PROPERTY_LOAD_REQUEST，直到超出最大调用堆栈大小。

版本：＆＃34; angular / core＆＃34;：＆＃34; 2.4.6＆＃34;，

＆＃34; @ ngrx / core＆＃34;：＆＃34; ^ 1.2.0＆＃34;，

＆＃34; @ ngrx / store＆＃34;：＆＃34; ^ 2.2.1＆＃34;，

＆＃34; @ ngrx / effects＆＃34;：＆＃34; ^ 2.0.1＆＃34;，

＆＃34; rxjs＆＃34;：＆＃34; 5.0.2＆＃34;，

注意：效果仅在app.module中注册一次。

Answer 1

@Effect会自行调度一个动作。您的效果一次又一次地调度相同的Action，直到执行调用堆栈或调用返回。

您需要将dispatch: false添加到效果装饰器：

@Effect({ dispatch: false })

或者你发出另一个动作：

.switchMap((action: Action) => {
    this.propertyService.load(action.payload);
    return Observable.of({ type: 'LOADING_DATA' });
});

Answer 2

在我的情况下，问题是由这段代码中的takeUntil引起的：

 return this.propertyAccommodationsService
   .loadAccommodations(action.payload.id)
   .takeUntil(this.loadAccommodations$)

通过调度2个PROPERTY_LOAD_REQUEST操作，第二个触发了takeUntil（）运算符，导致多个效果调用。在我的情况下，takeUntil（效果）是不必要的，所以我可以删除它，但仍然，我无法弄清楚为什么这个运算符导致运行多次效果。

单个操作调度会导致多个效果调用，直到超出最大调用堆栈大小

2 个答案: