如何使用 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 也构建良好。但是当我部署应用程序时没有 run/load 任何东西而是抛出 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 {}

Answer 2

使用适配器的 setAll 方法：

const initialState = adapter.setAll([homeTab], zeroState);

（其中 homeTab 是实体，zeroState 是 adapter.getInitialState 的 return 值）

如何使用 ngrx 将项目添加到处于初始状态的实体

How to add item to entities in initial state using ngrx

ngrx

ngrx-store

ngrx-entity