Question

我是ngrx和rxjs的新手，所以我认为可能有一个简单的解决方案，对我来说还不明显：-）

我已经建立了一个ngrx存储，并且在以下状态下可以正常工作：

AppState
- ThreadsState（实体）

我已经采取了行动，减速器工作正常。当用户创建新消息时，我调度一个动作MessageCreated，这导致新消息被添加到我的商店中（线程实体的array属性内），这反过来又更新了我的视图。哇！

我的Thread的可观察对象正在工作，现在包含新消息：

thread$ = store.pipe(select(selectThreadWithMessages(id));

我的问题是我需要一种方法来更新新创建的消息上的属性（isNew = true，以便在视图中应用动画）。但是，我不想仅将此应用于所有消息。我通过将其简单地应用于数组中的最后一个Message（应该始终是最新的）来使其“起作用”，但这并不像“正确”的方法。

如果没有一种简单的方法知道它是哪一种，如果我想对其中的最新物品做出反应怎么办？

这就是我想做的：

也许最初是订阅存储来获取初始数据，并且还有Messages的流被添加到集合中。似乎是从最初开始就避开了商店的目的...

也许可以将Messages分解为自己的功能状态，并为此设置一个单独的选择器？但这也许并不能真正解决我原来的问题。

我想通常可以归结为引用一个可观察的集合Message[]并正确应用视图加载后出现的新的单个实例Message。

我很喜欢反应式编程的想法，显然它对我来说还不是天生的。

任何建议都非常感激..！

Answer 1

最简单的解决方案可能是扩充ThreadsState (Entity)以单独存储“最近创建的消息”。然后，您可以订阅该消息，并在消息更改时做出适当的反应。

如果您使用的是ngrx效果，另一种方法可能是将Actions流注入您的组件并订阅MessageCreated动作（看起来只有MessageCreated才能起作用动作的有效负载包含足够的信息以标识哪个消息被创建。

即

constructor(
  private actions$: Actions,
) {}

ngOnInit() {
  this.subscriptions.push(
    this.actions$.pipe(ofType(MessageCreated)).subscribe(action => {
      // do stuff
    })
  )
}

ngOnDestroy() {
  this.subscriptions.forEach(sub => sub.unsubscribe())
}

如何以最佳方式订阅NGRX状态更改？

1 个答案: