typescript 如何在我的ngrx效果中取消API请求

iswrvxsc  于 2023-03-13  发布在  TypeScript
关注(0)|答案(1)|浏览(124)

所以在一个给定的页面上,我可以在同一个API端点上分派几个动作来运行一个搜索请求。在我的效果中,我有一个效果来发出这个请求,看起来像这样:

runSearchSuccess$ = createEffect(() =>
    this.actions$.pipe(
            ofType(MyActions.runSearch),
            mergeMap(({searchRequest}) => this.myService.runSearch(searchRequest).pipe(
                map((response) => {
                    return MyActions.runSearchSuccess({ searchResponse: response })
                }),
                catchError(error => {
                    const searchResponse = null;
                    return [
                        MyActions.updateSearchStatuses({searchResponse}),
                    ]
                }),
            )),
        )
    );

这些请求可能需要很长时间,所以如果用户在页面上的输入发生变化,一些正在运行的请求可能变得不必要,需要取消。与搜索请求相关的数据在存储中,所以我有一个选择器来获取所有请求。我想做的是观察此选择器中的变化,如果在任何时候搜索请求不再相关,我想取消它。我不认为我可以使用TakeUntil,因为它取决于选择器输出的内容。我尝试过使用TakeWhile,但找不到一种方法来真正取消API调用,而不仅仅是效果。有没有一种方法可以使用TakeWhile来实现这一点,或者有没有更好的方法来管理我的活动网络调用,并在需要时取消它们?

z9smfwbn

z9smfwbn1#

您需要将mergeMap替换为switchMap,不同之处在于mergeMap并行运行所有请求,而switchMap将在有新请求时取消挂起的请求。
文件:

相关问题