状态 A 使用 B，状态 B 使用 A答案

【问题标题】：State A uses B and state B uses A状态 A 使用 B，状态 B 使用 A
【发布时间】：2020-03-09 12:51:19
【问题描述】：

我创建了一个非常复杂的应用程序，以至于我必须将状态分成两个较小的状态。不幸的是，状态 A 中的一些选择器必须从状态 B 中读取某些字段，而状态 B 中的一些选择器必须从状态 A 中读取某些字段。

例如 - 状态 A：

@Injectable({ providedIn: "root" })
@State<{x: number;}>({
  name: "stateA",
  defaults: {x: 0}
})
export class StateA {
  @Selector([StateB])
  public static someSelector(stateA, stateB) {
    // do stuff...
  }
}

和状态 B：

@Injectable({ providedIn: "root" })
@State<{y: number;}>({
  name: "stateB",
  defaults: {y: 0}
})
export class StateB {
  @Selector([StateA])
  public static someSelector(stateB, stateA) {
    // do stuff...
  }
}

当我尝试实现它时，我得到了错误： Uncaught ReferenceError: Cannot access 'StateA' before initialization

错误在以下情况下消失： state A uses B and B doesn't use A 或 state B uses A and A doesn't use B

我该如何解决？

【问题讨论】：

标签： angular ngxs

【解决方案1】：

我认为以这种方式加载这些相互依赖的状态存在问题。

对于您描述的场景，您可以考虑使用与每个状态类分开定义的Meta Selector。这将允许您将状态组合在一起以形成一个从两个状态的属性中提取的选择器。

export class CombinedSelectors {
  @Selector([StateA, StateB])
  static combineThem(stateA, stateB) {
    // do stuff e.g.:
    return stateA.x + stateB.y;
  }
}

【讨论】：

感谢您的建议，但我认为如果有更多此类情况，可能会很麻烦。