从状态抽象选择器和动作处理程序

时间:2018-08-27 10:09:48

标签: angular ngxs

我想知道是否可以将@Selectors和/或@Action处理程序从@State类抽象到单独的文件中?随着状态变得越来越大,选择器越来越复杂,我想将它们移动到一个单独的文件中,以保持状态类的整洁。在NGXS中有什么方法可以做到这一点?

编辑:供以后参考,我在NGXS备用频道上得到了答案,的确有可能。我们可以创建一个单独的选择器类来存储所有选择器,并将它们的关注状态作为参数传递给它们。

export class EntityStateSelectors {
  @Selector([EntityState])
  thing(state: EntityStateModel) {
    return state.thing;
  }
}

到目前为止,我仍然没有弄清楚如何对动作处理程序执行相同的操作,但是将选择器提取到一个单独的文件中已经清除了很多状态类!

1 个答案:

答案 0 :(得分:3)

您可以为选择器创建一个单独的文件,强烈建议您使用。您可以使用以下内容创建类似于app.selectors.ts的文件:

export class AppSelectors {

  @Selector([AppState])
  static viewModel(state: AppStateModel) {
    // your selector logic here
  }

}

然后,您可以像下面这样在组件中正常使用

@Component({...})
export class AppComponent {
  @Select(AppSelectors.viewModel) vm$: Observable<ViewModel>;
}

这大大减小了app.state.ts文件的大小,因为它只保留了操作处理程序。另外,由于选择器只是纯函数,因此这使您的代码更易于测试