带有拖放功能的自定义问卷

Question

我构建了一个自定义问卷。 在左侧，我有工具（输入、选择等），在右侧是 DROP 区域...

我需要使用此表单工具创建一个调查表并将其保存到 API（用于测试到会话存储）... 当我拖放时，比如说输入，在拖放区我得到源代码...... You can see this in the example here

所以我的问题是，最好的方法是什么？

我的尝试：

• 创建一个可重用的组件（input-component、text-component、select-component...）并给出一个唯一的ID 到每个组件，并在 DRAG 区域中使用 *ngFor 循环遍历所有组件。但是，我只得到示例中的源代码

• 另外，存储这些选定的组件和/或在我从 API 获取它们时再次显示它们以进行编辑。如何做到这一点？

Answer 1

尝试创建表单组件，该组件将包含您所有的编辑/创建逻辑。 @Input 是您的问卷对象（编辑）或 null（创建）。拖放逻辑应该在外部（在您的列表组件中）。还要考虑它们之间的关系，创建在编辑/创建项目时通知列表组件的服务。