angular - 在 reducer 中过滤数据

Question

我在ngrx中通过reducer排序有问题。

选择器填满了表格 - 很好。

现在，我想为表数据实现一个过滤器解决方案 - 包含、开始等。在我看来，最好的解决方案是使用调度程序和操作，并更改减速器中的原始数据 -> 通过选择器更新，哪个在 ngOnInit 中使用。但是有没有可能回到原始数据？什么时候过滤器会是空的？或者在存储中创建重复数据 - 原始数据和过滤数据，并在它们之间切换？

Answer 1

您可以使用选择器选择原始状态，然后根据您的过滤器进行修改，而不是复制状态本身。

如果这是您想要的，请参阅例如取自在某些条件下过滤的官方文档。

export const selectUser = (state: AppState) => state.selectedUser;
export const selectAllBooks = (state: AppState) => state.allBooks;
 
export const selectVisibleBooks = createSelector(
  selectUser,
  selectAllBooks,
  (selectedUser: User, allBooks: Book[]) => {
    if (selectedUser && allBooks) {
      return allBooks.filter((book: Book) => book.userId === selectedUser.id);
    } else {
      return allBooks;
    }
  }
);

Answer 2

您可以将道具传递给选择器

export const selectAllBooks = (state: AppState) => state.allBooks;

export const selectBookById = createSelector(  
  selectAllBooks,
  (allBooks: Book[], props) => {
    const { id } = props;
    return allBooks.filter((book: Book) => book.userId === id);
}

在 ngOnInit 的 Component.ts 中

this.books$ = this.store.pipe(selectBookById, { id: 123 });