Как добавить элемент в исходное состояние с помощью ngrx

Question

Я использую сущности и вместо пустых сущностей в начале я хочу добавить элемент по умолчанию в исходное состояние. Я попробовал что-то вроде ниже:

const id = uuidv4()

const zeroState = adapter.getInitialState({
  activeTabId: id,
});

const homeTab = {
  pageID: id,
  pageTitle: 'Home',
} as PageInfo;

export const initialState = adapter.addOne(homeTab, zeroState);

Он отлично работает в среде разработчика и ng build --prod=true также прекрасно работает. Но когда я развертываю приложение, ничего не запускается / загружается и вместо этого выдает Uncaught Error: Cannot enable prod mode after platform setup..

Может кто-нибудь сказать мне, как добавить элемент в исходное состояние объекта?

Answer 1

К сожалению, adapter.addOne не работает так рано. Но есть несколько альтернатив.

Вы можете внедрить вашу сущность вручную, структура хранилища сущностей довольно проста:

const id: any = uuidv4(); // any because of type cast.

const zeroState = adapter.getInitialState({
    activeTabId: id,
});

export const initialState = {
    ...zeroState,
    ids: [
        ...zeroState.ids,
        id,
    ],
    entities: {
        ...zeroState.entities,
        [id]: {
            pageID: id,
            pageTitle: 'Home',
        },
    },
};

Или вы можете использовать эффект для этого, он работает в режим prod.

@Injectable()
export class EntitiesEffects {
    @Effect()
    public readonly data$ = this.actions$.pipe(
        ofType(ROOT_EFFECTS_INIT),
        switchMapTo(
            merge(
                of(
                    new UpsertAddress({
                        address: {
                            id: 'address1',
                            name: 'Address 1',
                        },
                    }),
                    // more entities
                    new UpsertUser({
                        user: {
                            id: 'user5',
                            name: 'User 5',
                            companyId: 'company3',
                        },
                    }),
                    new UpsertUser({
                        user: {
                            id: 'user6',
                            name: 'User 6',
                            companyId: 'company3',
                            managerId: 'user5',
                        },
                    }),
                ),
            ),
        ),
    );

    constructor(protected readonly actions$: Actions) {}
}

А потом в AppModule

@NgModule({
    imports: [
        EffectsModule.forRoot([EntitiesEffects]),
    ],
})
export class AppModule {}