Ngrx: как контролировать один объект в массиве для изменения

Question

Вот как я отслеживаю массив selectedUser.Однако, если любой другой элемент массива обновляется, наблюдаемая watchSelectedUser запускается там, где она должна запускаться только при обновлении до selectedUser объекта.

--- Текущий код ---

Код редуктора:

export const userAdapter = createEntityAdapter<UserModel>({
  selectId: x => x.UserId
});
export interface UserlistState extends EntityState<UserModel>{
  selectedUserId: number
};

export const initialState: UserlistState = userAdapter.getInitialState({
  selectedUserId: undefined,
}); 

const getSelectedUserIdState = (state) => { 
  return state.userlist.selectedUserId
};
export const getSelectedUserId = createSelector(getSelectedUserIdState,userId => userId);

Подписка на изменение выбранной модели пользователя

watchSelectedUser = (): Observable<UserModel>=>{
        return this.userlistStore.select(userlistReducers.selectAll).pipe(map(users => {
            return users.find(x=> x.UserId == this.getSelectedUserId());
        }));
    }

Answer 1

Я бы порекомендовал преобразовать вашу структуру данных из массива в пару коллекция / ключ-значение для каждого пользователя.

Это позволит вам select(userlistReducers[_id]) и означает, что у вас не будет других UserModelобъекты, изменяющие массив, в котором они содержатся.

state: ApplicationState = {
   users: {
      'd27f23d67f23i7d23': {name: 'Nate, '_id': 'd27f23d67f23i7d23'},
      '87387387g3487gd83': {name: 'Shyamal, '_id': '87387387g3487gd83'}
   }
}


watchSelectedUser = (): Observable <UserModel> => {
    return this.userlistStore.select(userReducers['87387387g3487gd83']);
}

Это немного грубо, и я не уверен, что логика select() идеальна, но теперь вы можете получить доступ только к одному пользователю за раз,Это потребует небольшого количества рефакторинга и нового адаптера сущности, но это IMO - лучшая структура.