如何使用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',
        },
    },
};

或者您可以为此使用效果，它可以在生产模式下工作。

@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 {}