обновить корневое состояние из функционального состояния ngrx

Question

У меня есть приложение, которое отображает блоги, используя ngrx

Основное корневое состояние выглядит следующим образом

import { Blog } from '../models/blog';

export interface AppState {
  readonly loaded: boolean;
  readonly blogs: {[key:number]:Blog}
}

export const initialState:AppState = {
  loaded: false,
   blogs: {}
}

У меня также есть специальный модуль для администрирования блогов

StoreModule.forFeature('crudBlog', reducers)

То, о чем я сейчас удивляюсь, это; когда я хочу обновить, удалить и т. д. блог, как мне получить доступ к AppState (корневое состояние) моего магазина из файла редуктора возможностей

Так что я могу сделать что-то вроде этого;

function handleBlogUpdatedAction(state, action){
    const index = action.payload.index;
    const newState = Object.assign({}, rootState);
    newState[index] = action.payload.blog
return newState;
}

Или есть лучший способ?

Answer 1

Состояние ngrx предполагается неизменным, вы меняете состояние с помощью присвоения ему newState[index] = action.payload.blog.

Так, например, вот так может выглядеть ваш редуктор:

export function reducer(
  state = initialState,
  action
) : BlogState {
    switch (action.type) {
        case UPDATED_BLOG_SUCCESS: {
            const blog = action.payload;
            const entites = {
                ...state.entities,
                [blog.id]: blog
            };

            // below is how your new state is returned using the spread operator
            return {
                ...state,
                entities
            };
        }
    }
}

Где initialState:

export interface BlogState {
    entities: { [id: number]: Blog };
    loaded: boolean;
    loading: boolean;
}

export const initialState : BlogState = {
  entities: {},
  loaded: false,
  loading: false,
};