问题标签 [ngrx-reducers]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
98 浏览

javascript - 如何在javascript中使用扩展运算符更新内部对象数组

我的减速器中有一个商店,需要更新一个内部数组对象值:

为了:

并想更新站点->订阅 [x] = action.payload

// 用解决方案编辑

我尝试了传播运算符,但他只是将我的新订阅推送到根站点,我不知道如何编写它来更新作为数组的对象 SubscriptionI。

0 投票
1 回答
214 浏览

angular - 如何使用ngrx中的数组更新状态

我正在尝试迁移我的应用程序以使用 ngrx。第一个功能是加载我的实际内容并显示它,但我有一些问题。

我在减速器中定义了这个:

我准备并实现了从 API 获取信息的效果。它工作正常。但我不知道如何将三个数组的值分配给状态,实际上我正在这样做:

但它没有按预期工作。

在此处输入图像描述

我做错了什么?提前致谢

0 投票
4 回答
7566 浏览

angular - ngrx 更新数组内的对象

我有一个带有对象数组的 ngrx 商店。我正在寻找的是,使用数组索引更新(修改)数组内的对象。我的 ngrx 数据看起来像,

我必须根据数组索引更新受益人姓名。所以我实现了以下reducer功能

上述代码的问题是,在运行此代码后,我的商店结构更改为

请帮助我修复代码,以便我可以在不更改商店结构的情况下更新值。

0 投票
1 回答
161 浏览

angular - Angular:在不同的根中重用reducer和选择器(不使用redux)

我确实有不同的路线

/部

/候选人

/候选人部门

我必须在/candidates 和/candidates-department 中使用相同的reducer 结构(状态和动作)。候选部分很常见,但在从 api 获取数据和存储该数据方面存在细微差别。

因此 /candidates 将列出所有候选人,但对于 /candidates-department,我们确实有显示与该部门对应的候选人的部门列表。

有什么方法可以在/candidates-department 中使用与/candidates 相同的store/action/reducer,而/candidates 和/candidates-department 中的功能键只有区别。

我还需要重用选择器。

0 投票
1 回答
1546 浏览

angular - 在 ngrx 中删除项目及其子项

我是ngrx store 的新手,对逻辑的放置感到困惑,即遍历数组是否应该转到reducer 或组件。我有一个 Item 类型的对象数组,并且必须删除一个项目。在删除一个项目时,我必须删除它在父母的孩子以及它的所有孩子中的引用。

Item 的 children 属性包含 Item 本身类型的对象的 id

我必须在发送动作“DeleteItemByID”时从数组中删除一个项目及其对应的子项,例如,如果我要删除 id=4 的项目,它会更新 id="1" 的项目并从其中删除“4”儿童阵列。然后删除操作会删除 id="6" 的项的子项,最后删除 id="4" 的项。

帮我找出我应该采取的删除操作的最佳方法。

0 投票
1 回答
48 浏览

angular - 带 Null 的角减速器和蓄能器

在下面的代码中,我想做类似的事情

这样就不会为此键创建对象/节点。我怎样才能做到这一点?

0 投票
1 回答
66 浏览

angular - 注销时如何清理ngrx存储

我想在注销后清理商店中的所有状态。这是我的减速器/index.ts

我的 app.module.ts

除了我已经有了我的 auth reducer(authState) 两个动作登录和注销

0 投票
1 回答
257 浏览

angular - 重用reducers逻辑

问题

我想使用ngrx链接多个高阶reducer,这样我reducer中类似的代码部分只有一个实现。

我的应用程序有许多页面具有非常相似的功能。他们的减速器看起来也很相似。对于此示例,让我们考虑一个具有三页的应用程序:第一页、第二页和第三页。这些页面中的每一个都包含一个计数器,但允许用它做不同的事情。所以:

  • 第一页可以增加减少计数器的值
  • 第二页可以增加减少重置计数器的值
  • 第三页可以增加重置计数器的值

可以在此处找到此类应用程序的示例。这是非常幼稚的实现,每个页面都有单独的减速器 - 每个减速器中重复了许多非常相似的功能。

仅使用一台高阶减速机的解决方案

我设法使用高阶化简器将部分通用逻辑移动到分离代码段。在这种情况下,它是增量功能:

这个高阶减速器可以这样使用:

到目前为止,一切正常。像这样正常工作的应用程序在这里

使多个高阶减速器工作的问题

当我尝试链接多个高阶减速器工作时,问题就开始了。在示例应用程序中,第二第三页都能够重置计数器(也可以递增),所以我现在想使用 2 个高阶减速器。我准备了新的高阶减速器,与前一个非常相似,应该可以完成工作:

它单独工作时工作正常,但是我找不到一种方法让它以这样的方式工作,withIncrementationwithReseting在同一个减速器上工作正常。可以在此处找到我尝试实现的示例应用程序,但它不起作用(似乎我的状态根本停止工作)。

使用 3 个独立减速器的简单方法

单台高阶减速机工作正常

链接不起作用的高阶减速器

0 投票
1 回答
55 浏览

angular - NgRx - 无限次触发减速器

我正在尝试通过 NgRx 效果检索本地存储数据。PATIENT_FETCH调度动作以执行效果。但是在调用方法中的调度方法时会无限调用ngOnInit

这是stackblitz演示。如果您取消注释patient.component.ts给定链接的第 24 行,那么会无限次调用 reducer。我可能在 NgRx 实现中遗漏了一些东西。

0 投票
1 回答
31 浏览

ngrx - 如何在 NgRx 减速器中执行业务逻辑

嗨,我在我的 Angular 项目中使用 NgRx 商店进行状态管理。

我的目标是在动作调度中清除一些状态属性。属性名称数组被传递给动作。

// 行动

// 减速器

/ 如何遍历字段数组并将状态属性值设置为空白