具有特定条件的NgRX Store和rxMethod

Question

我正在使用 NgRx 商店，并且想要使用

rxMethods

处的

ngOninit

。

我遵循 NgRX 商店的指南进行

rxMethods

。该示例非常接近我正在寻找的内容。但我不知道如何调整给定的代码。

我想要

fetchAllAgain=signal<boolean>(false);

ngOnInit():void{
  loadAllBooksByChange(fetchAllAgain);
}

应该在 UI 上更改该值 - 为了简单起见，我将其保留为简单的 init。

我想在

loadAllBooks

更改为

fetchAllAgain

时立即运行方法

true

。

loadAllBooksByChange=rxMethod<void>
  pipe(filter(fetchAllAgain),
    exhausMap(() => {
        .....

我不确定

1. 如果

   signal

   fetchAllAgain

   应在

   rxMethod

   内或室外查询。如果在外面，那么我只有用

   effect

来实现的想法
2. 我不清楚如何查询过滤器并设置响应。

Answer 1

无需使用效果，rxMethod将对源信号做出反应，您可能只需要对代码进行一些小的修改。这是如何使用过滤器和设置响应的示例。每当 fetchAllAgain 从 ui rxMethod 发生变化时，都会对其做出反应。

const loadAll = rxMethod(
  pipe(
    filter((fetchAllAgain) => fetchAllAgain as unknown as boolean), 
    tap(() => patchState(store, { isLoading: true })),
    switchMap((load) => {
      return service.loadAll().pipe(
        tapResponse({
          next: (planets) => {
            console.log('Planets', planets);
            patchState(store, { planets, isLoading: false });
          },
          error: (err) => {
            patchState(store, { isLoading: false });
            console.error(err);
          },
        })
      );
    })
  )
);