使用ngrx效果或组件提交数据

Question

我们在这里与我的一个朋友讨论了一项任务，该任务是“如果单击表单的提交按钮会发生什么”？ 要求是首先使用ngrx存储中的数据来验证该表单，然后将该数据提交到服务器。

...所以有两种方法可以实现：

分派“ SUBMIT_ACTION”时将触发使用ngrx / effects的

• 。它将获取数据，然后通过服务调用API

• 使用该组件-它会“采用（1）”配置，确认一切正常，然后通过服务调用API

据我所知-在这种情况下使用效果是很普通的事情。你觉得呢？

Answer 1

我认为这个问题没有正确的答案，这完全取决于您，选择合适的解决方案是您作为开发人员的职责。

如果是简单形式，我个人会这样做：

• 验证表单是否正确填写（客户端验证）
• 使用（可序列化的）表单对象调度保存操作，这不是Angular的形式，而只是一个JavaScript对象
• 收听此操作，然后致电服务
• 如果出现问题：显示一条消息（通知，烤面包机，小吃店等）
• 如果一切正常，请关闭表格

Answer 2

这个问题可能没有正确的答案。 我个人不喜欢将验证发送到商店。我更喜欢使用angular的内置验证工具来验证我的表单。 对于我当前的项目，我们使用反应式表单来验证输入，然后使这些表单与商店保持同步。 （此外，我们正在同步有效，已触摸，待处理，错误等属性）

优点之一是，您基本上可以从任何地方提交表单，也可以将它们拆分成较小的部分并合并，然后再将其发送到服务器。 而且，您能够编写可重复使用的角度组件，这些组件与底层商店架构无关，并且可以轻松地进行重构。要将表单绑定到商店，您可以使用服务或抽象类。

简短示例：

• 反应形式验证输入
• 表单数据与商店同步（包括有效，未决，错误）
• UI元素（提交按钮/禁用表单/旋转器）链接到有效/待处理属性
• 已调度“ SUBMIT_ACTION”，并将状态更改为“待定= true”
• 效果正在等待答案，并调度“ SUBMIT_ACTION_ERROR”或“ SUBMIT_ACTION_SUCCESS”
• 显示错误或显示成功通知