Фильтрация данных в редукторе

Question

У меня проблема с сортировкой через редуктор в ngrx.

Таблица была заполнена селектором - хорошо, отлично.

Теперь я хотел бы реализовать решение для фильтрации данных таблицы - содержит, начало с, et c. И на мой взгляд, лучшим решением будет использование диспетчера и действия и изменение исходных данных в reducer -> update через селектор, который использовался в 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);
}

В Component.ts в ngOnInit

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