时间戳

首页 > 解决方案 > 在 switchMap 中调度 ngxs 操作忽略返回值

ngxs - 在 switchMap 中调度 ngxs 操作忽略返回值

问题描述

必须有一个标准的方法来解决这个问题，但我还没有找到任何东西。我可能没有正确表达我的搜索。

我有一个搜索输入字段，作为一种好的做法，switchmap当用户继续输入时，我使用运算符取消以前的 http 请求。

我以 ngxs 文档中的示例为基础：

this.actions$
  .pipe(
    ofActionDispatched(SomeAction),
    debounceTime(2000),
    distinctUntilChanged(),
    untilDestroyed(this),
    switchMap(() => {
      return this.store.dispatch(new SomeOtherAction());
    })
  ).subscribe(() => {
});

SomeAction每次用户在输入字段中键入内容并保存在商店中时都会调度（这就是为什么SomeOtherAction没有构造函数参数）。

如果没有这个空的订阅块，有没有更好的方法来做到这一点？这看起来像一个反模式。

标签： ngxsswitchmap

解决方案

您可以考虑的另一种方法是仅在您等searchText之后调度操作以更改状态。debounce

在搜索输入表单控件上使用Observable，您可以在调用您的操作以修改状态之前valueChanges通过管道debounce/distinct/filter或任何适合您目的的组合。store.dispatch

然后，您只需将状态修改为所需的最少时间，而不是每次按键，并且还可以从那里调用 HTTP 请求（我认为您不需要组件中的操作流订阅）。

Angular 表单的 DocovalueChanges 在这里

推荐阅读