如何解决NGXS 延迟加载模块与应用程序的其余部分具有不同的状态
我有一个 CoreModule 急切加载并包含主应用程序状态，还有一个 ContractHolder.module 使用 NgxsModule.forFeature([ContractHolderState]) 声明要添加到主应用程序的新状态已加载。但是，延迟加载模块中的组件看到的初始状态为 {}（因此未按照 ContractHolderState 中的定义进行初始化），稍后当 ContractHolderState 的 {{ 1}} 处理程序更新状态。
在应用的其余部分，我看到包含初始化的 @Action 的应用状态，但是当 ContractHolderState 更新它时它没有更新！
简而言之，我的延迟加载模块根本看不到应用程序状态，而是看到了一个由惰性状态 ContractHolderState 更新的空对象，而应用程序的其余部分看到的是初始值为 ContractHolderState 定义，但从未更新。
代码：
ContractHolderState，定义主应用程序状态并由 Core.module 导入：
App.module我有 const ngxsstates = [ConfigurationState,AuthenticationAuthorizationState];
@NgModule({
imports: [
NgxsstoragePluginModule.forRoot({
key: appStateNames.authorization,}),NgxsModule.forRoot(ngxsstates,{ developmentMode: !environment.production }),// <--- NGXS states
NgxsReduxDevtoolsPluginModule.forRoot(),NgxPermissionsModule.forRoot(),],providers: [...],exports: [...],declarations: [...],})
export class CoreModule {}
是延迟加载的：
ContractHolder.module这是@NgModule({
declarations: [MainViewComponent],imports: [
CommonModule,CoreModule,// <--- imports core module with the main state
RouterModule.forChild([{
path: '',component: MainViewComponent,}]),NgxsModule.forFeature([ContractHolderState]) // <--- declares state
],})
export class ContractHolderModule { }
：
ContractHolderState@State<ContractHolderStateModel>({
name: appStateNames.contractHolders,defaults: {
contractHolders: [],},})
export class ContractHolderState {
@Selector()
static contractHolders(state: ContractHolderStateModel): IContractHolder[] {
return state.contractHolders;
}
}
中的路由定义是如何延迟加载 ContractHolder.module 的：
app-routing.module现在合约持有者模块中使用的 const routes: Routes = [
{
path: 'home-page',component: PageComponent,children: [
{
path: 'ch',outlet: 'page',loadChildren:
(): Promise<ContractHolderModule> => import('./contract-holder/contract-holder.module')
.then(m => m.ContractHolderModule) // <--- lazy-loaded ContractHolder.module
},]
},{
path: '**',component: LoginComponent
}
];
@NgModule({
imports: [RouterModule.forRoot(routes)],exports: [RouterModule],})
export class AppRoutingModule {}
通过 main-view.component 查看状态。我还尝试查看返回空对象的 @Select(ContractHolderState.contractHolders) allCh$: Observable<IContractHolder[]>;。 this.store.snapshot() 更新状态后，它不再是一个空对象，但状态的其余部分（来自应用程序的其余部分）永远不会存在。
在发生这种情况时，主应用程序会看到完整状态，但 ContractHolderState 始终具有其默认值 ContractHolderState，并且永远不会更新。
解决方法
问题在于导入了不止一次定义主状态的 CoreModule。我们有多个模块导入核心模块。我保留了 App 模块导入的核心模块，所有其他功能现在都在一个新的 SharedModule 中。
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。
