angular - Angular ngrx 管理父子之间的可观察对象和订阅

Question

我的商店状态有一段数据称为选定变量：

如果我只有一个组件，我会订阅一个 observable 并使用如下内容：

我设计了一个父组件，其中包含三个选项卡和三个子组件，以使我的 html 和 typescript 代码更清晰：

任何子组件以及父组件都可以更改 State 的 selectedVariable 部分。是否有必要在每个子组件和父组件中选择并订阅“selectedVariable”以使子组件和父组件对任何状态更改做出反应，或者是否有更有效和更优雅的方式来完成相同的结果？

Answer 1

更好的方法是使用async管道并将数据作为 anInput传递给三个子组件。在那里，您可以直接在模板中使用该数据，也可以使用ngOnChanges命令式的方式对该存储数据中的更改做出反应。如果您想从子组件调度操作，您可以将 注入Store这些组件并从它们调度，或者（在我看来，这是一种更可取的方法）从子组件（使用Output EventEmitters）发出事件并仅从父组件调度。这样你就可以将组件与 store 解耦，只有你的父组件会处理 store 的逻辑，而子组件会处理 UI 的显示。