问题标签 [ngxs]
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.
angular5 - ngxs、redux 开发工具显示之前的状态
这是一个简单的例子。
在 console.log 中,状态已正确更新。模板也正确更新。
在 redux 开发工具中,状态会随着调度的延迟而更新。
更清楚地说,初始状态是:
当我单击“获取”按钮时,组件会调度两个事件:
LoadingData 只是清空数据数组并将 loading 设置为 true:
在控制台和模板中,状态更新正确,但在 redux 开发工具中加载仍然是错误的:
GetData 是一个 Action,它执行一个返回 Observable 的服务方法,然后调度两个事件 DataSuccess 和 increase :
只是现在,在 redux 开发工具中加载设置为 true
只增加增量计数器和 DataSuccess 将加载设置为 false 并填充数据数组:
DataSuccess 在Increase 之前执行。在 DataSuccess 中的 redux 开发工具中,加载仍然设置为 true,并且数据数组仍然为空。
在增加数据数组的 redux 开发工具中,最终填充了数据,但计数器设置为 0。
所以 redux 开发工具总是显示之前的状态。我是 redux/ngrx/ngxs 的新手,所以我不知道这种行为是否是我的错。我非常感谢任何提示或更正以使其以正确的方式工作。
ngxs - 最好在哪里发布有关 ngxs 的问题?
我看到 ngxs 标签目前在 Stack Overflow 中并没有太多的问题。我应该在这里提问还是在这里发布 github问题?
ngxs - 是否可以在状态 B 的选择器内使用状态 A 的数据?
我正在尝试将 Ngxs 作为状态管理系统,并遇到了一个我似乎无法弄清楚的特定用例。在这个用例中,我使用了两个标准化对象(为了便于阅读,我删除了一些不必要的字段)。
这两个对象驻留在不同的商店中。一个 SectionStore 和一个 QuestionFlowStore。状态模型如下:
现在我想在 QuestionFlowsState 中创建一个选择器,它返回属于 currentSection 的每个 questionFlow。是否可以在位于 QuestionFlowState 内的选择器内获取 currentSection,而 currentSection 位于 SectionState 内?我已经尝试了下面的代码(有一个填充的商店)但没有成功。
如果问题中有任何遗漏/不清楚的地方,请告诉我。
编辑: 在与@Danny Blue 反复讨论之后,我们找到了添加父状态的解决方案,该状态将包含选择器所需数据的状态作为子状态(可以在@State 装饰器中设置)。要访问这些儿童商店的数据,您需要致电 state.. 并且一切顺利。下面是解决我的问题的最终代码。
javascript - 为什么使用 NGRX 而不是构造函数注入服务?
想知道为什么要为 Angular 应用程序使用NGRX或NGXS而不是构造函数注入服务来处理组件 IO?
是否只是为了确保组件属性引用在不切换整个属性值引用的情况下永远不会发生突变,还是还有更多?
NGRX 的替代品
根据我开发的答案:
切片。
我相信它可以完成 NgRx / NgXS 所做的一切(时间机器除外 - 但这很容易通过增量通知实现 - 已经支持)。但样板为零。
这是一篇展示一些功能的文章: https ://medium.com/@ole.ersoy/storing-users-in-the-reactive-slice-object-store-5ea0fab06256
angular - NGXS + Firestore 或 Firebase 身份验证
我看到 Angular 的 NGXS 状态管理器已经发布,我是这个主题的新手。我正在尝试了解如何将 firestore 或 firebase auth 连接到 NGXS,但因为它太新了,我没有在互联网上的任何地方找到如何做到这一点的信息,如果有人能解释我如何连接那些。谢谢
angular - 从后端加载数据的操作/状态
我刚刚开始尝试,ngxs
但从我目前的阅读来看,我并没有 100% 清楚我应该在哪里回调我的 API 以保存和读取数据(我见过的所有示例要么不这样做,要么使用一些模拟)。
例如,我创建了一个维护项目列表的状态。当我想添加一个项目时,我将“AddItem”操作发送到商店,在那里我将该新项目添加到状态。这一切正常 - 问题是插入将项目发布到服务器的调用的合适位置在哪里?
我是否应该在我的操作实现中调用 API,即在我更新商店的项目列表之前。
或者我应该在我的 Angular 组件中调用 API(通过服务),然后在收到响应时调度“添加项目”操作?
我对这个领域很陌生,所以这些方法的任何指导或优点/缺点都会很棒。
angular - NGXS @Select 与状态模型一起使用
使用 NGXS@Select
装饰器时,访问状态模型上定义的属性的正确方法是什么。
例如,定义了以下状态:
在一个组件中,如果我想像这样选择用户状态:
我收到打字稿错误,因为该firstname
属性不存在UserState
(因为它是在相关模型类型上定义的)。如果我在组件 html 模板中引用该属性,那么我没有任何问题。
关于选择器的使用有一个相关的讨论,但我只是想确认一下我对当前版本的期望(如果我做对了!)。
我正在使用"@ngxs/store": "^3.0.0-rc.2",
select - 带参数的自定义 Select()
更新
从@NGXS v3.1 开始,他们终于在@Selector() 中引入了参数。
https://www.ngxs.io/concepts/select#lazy-selectors
DOCS 中的示例
首先,您定义 @Selector “ pandas ”
然后你只需在你的'.ts'文件中调用它
*来自旧邮报*
我正在尝试创建一个自定义 @Select () 以便能够向下钻取特定树并动态返回值。获得未定义或未定义(执行)
用户.component.ts
用户状态.ts
ngrx - JSON Monolith 模型,它与状态和构建 Store 有什么关系?
我有一个项目,我在其中获得了一个大的前置 JSON,它基本上成为程序的状态。JSON 的一个愚蠢示例可能如下所示:
所以这是我的数据。但在默认初始化下,这不是我的状态。
我真的希望它是这样的
我不了解的关键是我的模型ngrx
和ngxs
我的状态之间的关系。一个不亮的灯泡。
- 什么机制负责创建人员集合?
- 什么机制负责计算每个人的年龄
或者我完全不在滑雪道上?尝试从单体应用程序中提前生成整个商店是错误的方法吗?例如,我的模型是否去了某个地方,我将其用作稍后动态创建状态的参考?
angular - 绑定到状态 - 这是预期的行为吗?
我有一个包含项目集合的状态:
当我添加一个反映在显示列表中的新项目时,我的组件订阅了商店中的项目列表(一切正常)。
观察到的行为
然后,我将该显示的项目绑定到一个input
字段 - 当我在该输入字段中键入时,我似乎正在修改该项目的状态,即该项目的“查看名称”显示也在发生变化。
这是预期的行为吗?我原以为我不会在“仅查看”列表中看到该更改。
或者这只是我做我不应该做的事情的一个例子 - 我知道我真的应该通过这样的操作将更改发送到商店:
Update Name: <input [ngModel]="item.name" (ngModelChange)="updateItem(item.name)" />
我正在测试这个
在此处查看完整的示例回购https://github.com/garthmason/ngxs
谢谢!