其他 - 使用 Redux 与 Components

让我们从建立一个计数器组件开始。这个组件将负责跟踪其被点击多少次并显示该数量。

app/components/counter-component.ts

View Example

在这种情况下，点击事件绑定到从 ActionCreatorService调用我们的动作创建者的表达式。

让我们来看看@select的使用。

是Ng2-Redux的一个功能，它旨在帮助您以声明方式将 store 的状态附加到组件。您可以将其附加到组件类的属性，Ng2-Redux将创建一个并将其绑定到该属性。

所以现在，任何时间store.counter由reducer更新，counter$将收到新的值并且将在模板中更新它。

请注意，@select支持各种各样的参数，以允许您以非常大的灵活性选择部分Redux存储。有关更多详细信息，请参阅 Ng2-Redux 文档。

Ng2-Redux“选择模式”样式与react-redux使用的“连接”样式有点不同;然而通过使用Angular 2的DI和TypeScript的装饰器，我们可以有一个很好的声明式绑定，其中大部分的工作是在模板中完成。我们还获得和OnPush变化检测的功能，以获得更好的性能。