问题标签 [ngrx-store-4.0]

在使用 angular2+ 开发的应用程序中，使用 ngrx/store 而不是 reduxJs 实现数据流架构的优点/缺点是什么。对于在 angular2 中开发的大型 Web 应用程序，哪一个会更好： 1. redux 2. ngrx/store 3 angular-redux

无法找到它们各自带来的特定功能，这可能有助于使用 angular2+ 开发复杂的应用程序。

我正在考虑升级一个使用ngrx v2的相当大的角度应用程序。我们的减速器，尤其是选择器看起来就像这个仓库当时所做的那样：https ://github.com/ngrx/example-app/blob/05be2b0c1dd1b1d522adb796bd4c1fce2cc5b366/src/app/reducers/books.ts 。

然后使用组件中的数据：

迁移指南还说：

@ngrx/core 不再需要，并且可能与 @ngrx/store 冲突。您应该将其从您的项目中删除。

因此，当我删除导入'@ngrx/core/add/operator/select'时，我会得到大量的“属性'select'在'Observable'类型上不存在。

如果我不想引入示例应用程序正在使用的重新选择，推荐的迁移路径是什么？

我正在为@ngrx/store 创建选择器。从概念上讲，它们似乎类似于 SQL 中的存储过程或其他东西。

也就是说，在某些情况下，我需要提供论据，这是迄今为止我得出的最佳解决方案。

我知道这个例子很简单，但我想了解的是itemById实现如何影响记忆。我的直觉告诉我它会损坏，甚至可能泄漏（因为工厂返回的每个函数都有自己的缓存，可能永远不会被释放）？

就是说，上帝知道我的直觉并不总是正确的……如果有人能提供一些令人惊奇的见解的话。

我正在 Nx 工作区中使用 Angular 5 和 @ngrx/store 开发企业应用程序。

我们的应用程序的要求之一是支持打开多个选项卡——这意味着从我们的侧菜单中，用户可以选择多个功能或相同的功能，并在我们的应用程序的单独选项卡中打开它们。我们需要能够分离这些选项卡的状态，因为用户可以在应该完全分开的多个选项卡中打开相同类型的搜索。例如，他们可以打开一个帐户搜索选项卡并按帐户 ID 123456 进行搜索，然后在另一个帐户搜索选项卡上搜索 234567。显然我们不希望一个选项卡中的状态与另一个选项卡发生冲突。

我不确定最好的方法是什么。我们的帐户搜索子功能的示例状态类似于

libs/accounts/src/search/+state/search.reducer.ts

它上面有一个顶级功能状态，例如：

libs/accounts/src/+state/index.ts

我能想到的一种解决方案是将上述子功能状态存储在选项卡 ID 下。

libs/accounts/src/search/+state/search.reducer.ts

libs/accounts/src/+state/index.ts

.. 这将需要一个单独的 TabState 可以在我们所有的功能模块中使用，并且至少包含以下内容：

libs/tabs/src/+state/index.ts

然后我们可以创建使用这两种状态的选择器：

libs/accounts/src/+state/index.ts

当用户单击不同的选项卡时，我们必须发出一个会更改所选选项卡 ID 的事件，这需要通过让每个功能中的选项卡缩减器查找操作并更新功能状态来处理，以便它知道当前的选项卡。这意味着对于我们所有的功能，我们都需要有这种结构——当我真的想以某种方式抽象出来的时候。我只是不确定如何做到这一点。我也不想将选定的选项卡 ID 存储在每个功能存储中 - 相反它将处于根状态，但我不完全确定如何将该值传递给功能状态以返回正确的数据。

任何人都有更好的方法来解决这个问题？

谢谢，

担

tying to get Array<StaffInterface> from a Observable<Array<StaffInterface>> in ngrx store.select which returns the Observable<Array<StaffInterface>> so that i can pass the Array<StaffInterface> to primeng datatable.

In the above assignment store.select returns Observable<Array<StaffInterface>>. I need to convert it to Array<StaffInterface>

当您需要从 http 请求将数据添加到应用程序中时，我听说它的好做法是：

1. 调度一个动作，它激活一个@Effect.
2. @Effect从http请求中获取数据。
3. 然后这会触发另一个动作
4. 然后最终更新商店。

这背后的基本原理是因为 http 调用是一种副作用，因此应该由@ngrx/effects库处理。

这个好吗？我发现这是有问题的，因为一旦发送了第一个操作，我不知道它是成功还是失败。我知道的唯一方法是我State是否有“hasErrorHappened”属性或类似的东西。而且我不相信拥有这样的财产是一件好事

还是更好：

1. 创建一个执行http调用的服务，该服务获取数据
2. 使用该数据在服务后更新商店

我有减速器，它可以在状态下创建新属性。

app.module.ts

应用程序.reducers.ts

gadget.reducer.ts

小工具.actions.ts

现在当我从 Angular5 组件调用动作时

state 看起来像 { dummy:'', newProp:'value' }。

我的下一步 - 订阅该属性的更改。但在这里我有问题。当我从 Angular 5 组件订阅时，该属性在状态中不存在。

我的问题：我如何检查商店中的现有属性，如果不存在则创建并订阅该属性？我接下来尝试，但它不起作用：

有很多文章推荐使用 ngrx/effects 来处理异步操作，例如 http REST 调用。为什么我们不能使用常规服务来进行 http 调用，然后获取该 http 调用的结果并调度一个动作，而不是使用效果？这不是简化事情吗？

我有效果类，我想根据路由器参数 ID 加载详细信息

我想在有效负载中获取路由器参数，这样我就不必从组件传递有效负载，而是直接从效果类中获取它。

我使用带有效果的 ngrx-store 4.x 和 Angular 5。

我有一个简单的用例，当数据成功保存在后端时，我需要显示通知。

目前我不确定实现这一目标的最佳方法是什么。我看到两个选项：

1. 商店中的标志和组件中的标志：
   • 在商店中添加“dataSaved”标志。保存数据时，该标志由效果中的动作设置为真。
   • 在角度组件中，添加一个附加标志“已调度”。当按下“保存”按钮时设置该标志。
   • 如果两个标志都为真，则显示“数据已保存”对话框。
2. 商店中的标志和重置操作：
   • 在商店中添加“dataSaved”标志。保存数据时，该标志由效果中的动作设置为真。
   • 在组件的 ngOnInit 方法中重置“dataSaved”标志。
   • 如果“dataSaved”标志为真，则显示“数据已保存”对话框。

我在选项 2 中看到了一个潜在的问题：如果请求需要很长时间，用户可以离开组件并再次返回，如果请求然后完成，保存的通知会突然出现。

这两种选择对我来说都有些过于复杂了——有人能指出我正确的方向吗？