2

我正在尝试创建一个延迟加载指示器的效果，以便每次从 API 检索数据时它不会闪烁或闪烁。这很可能是不知道要搜索什么的情况，因为我敢肯定，我不可能是唯一一个想要在将这样的指示器扔到屏幕上之前给 API 300-500 毫秒响应的人。

  @Effect() startDelayTimer: Observable<Action> = this.actions$
    .ofType(uiActions.START_LOADING_DELAY_TIMER)
    .switchMap(action => Observable
      .timer(300)
      .mapTo(new uiActions.LoadingDelayTimerCompleteAction));

有什么东西会破坏这个效果的完成吗？我正在将我的所有动作/状态对记录到控制台，并且正在调用 START_LOADING_DELAY_TIMER，但永远不会完成。

编辑

过早地提出了这个问题，因为我遇到的问题最终无关紧要。这是最终的实现，以防其他人发现这个问题：

@Effect() startDelayTimer: Observable<Action> = this.actions$
    .ofType(uiActions.START_LOADING_DELAY_TIMER)
    .switchMap(action => Observable
      .timer(5000)
      .takeUntil(this.actions$.ofType(uiActions.CANCEL_LOADING_DELAY_TIMER))
      .mapTo(new uiActions.LoadingDelayTimerCompleteAction)
  )
  • 启动计时器以延迟加载指示灯闪烁
  • 如果 aCancelLoadingDelayTimerAction被调度（可能是从 API 完成数据检索），停止计时器并且不显示加载指示器。
  • 如果计时器在CancelLoadingDelayTimerAction调度之前完成，则显示加载指示器。
4

1 回答 1

1

而不是.timer(300)，使用.delay(300). 那应该可以解决您的问题。

Timer 在给定的时间间隔内发出数字，这可能会导致您的效果出现一些奇怪的行为。延迟只是在给定的时间内限制流，我认为这是您所要求的。

于 2017-07-31T15:20:12.473 回答