如何跨多个组件创建一个单一的反应形式

Question

我是Angular的新手。 我的应用程序具有反应形式。 它有4页（4个不同的组件）。 我的表单字段也分布在4个组件中。

每页结束时，用户单击按钮即可导航到下一页。 第4页上的“提交”按钮。 我的意图是将表单数据提交到服务器。

我的问题是：

1）是否可以跨4个组件创建一个单一的反应形式。

如果不可能的话

2）我在所有4页中创建了4种不同的反应形式。 每个页面按钮单击都会将表单数据发送到共享的通用服务。 最后第四页从服务中获取所有表格数据。 是这种正确的设计方法。 请指导我。

3）如果我遵循上述设计方法，则在第4页上，我将从所有4个组件中获取表格（反应性）数据。 如何构造一个具有不同组件（表单）数据的POST请求数据。

Answer 1

解决方案2很好。 您需要创建一个服务中的类或数据数组，这些类或数组将保留您的数据，直到将其发送到服务器为止。 该类或数组将具有所有4个页面的所有数据，并且每次单击按钮（在每个页面上）时，您都将使用该页面的数据填充部分类/数组。 当您单击第4页的最后一个按钮时，您将把数据从该类/数组发送到服务器。

Answer 2

1. 创建一个包含所有字段的接口。

2. 使用具有您创建的接口类型的变量创建通用服务。

   serviceVariable = {};

3. 在每个页面的提交单击中，使用object.assign（）函数合并该对象。

   serviceVariable = Object.assign（serviceVariable，formName.value）;

4. 最后在发布请求中使用serviceVarible。