0

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

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

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

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

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

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

4

1 回答 1

1

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

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

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

Angular 表单的 DocovalueChanges 在这里

于 2020-04-30T12:41:22.683 回答