javascript - Form.io 表单构建器如何发出或提交数据
问题描述
我正在构建一个动态拖放表单构建器,但我找不到控制台注销表单数据的方法。这是component.html
我呈现拖放表单的表单
<div>
<form-builder [form]="form" (change)="onChange($event)" (submit)="onSubmit($event)"></form-builder>
<div class="well jsonviewer">
<pre id="json"><code class="language-json" #json></code></pre>
</div>
</div>
这是component.ts
我只是想控制表单数据,然后我会将其发送到 API 进行保存。
import { Component, OnInit, ElementRef, ViewChild } from '@angular/core';
@Component({
selector: 'app-user-add',
templateUrl: './user-add.component.html',
styleUrls: ['./user-add.component.css']
})
export class UserAddComponent implements OnInit {
title = 'ASW Form Builder Demo';
jsonData:any[]=[];
@ViewChild('json') jsonElement?: ElementRef;
constructor() { }
ngOnInit(): void {
}
// Publish Template
saveJsonData(data: any){
//....
console.log(data);
// do something
}
//Preview Template
previewTemplate(data: any){
this.jsonData = data;
}
public form: Object = {components: []};
onChange(event) {
console.log(event.form);
}
onSubmit(param){
console.log(param);
}
}
谁能帮我从提交的表单中获取数据?我可以在表单外的另一个分区和按钮上执行此操作吗?我想使用我自己的提交按钮。或者是否有任何教程可以从数据库设计开始解释这一点?
解决方案
推荐阅读
- python - 使用正则表达式从数据框中删除/排除列 - Python
- angular - 类型“IGridInstanceOf”上不存在属性“选择”
' 执行 gridApi.grid.selection.selectAll 时 - android - 如何通过类名访问具有 R.id 的父元素中的元素
- abap - 在没有 NavBar 工作中心的情况下运行 Tr.launcher
- c# - 基于用户角色的不同主页
- java - 如何在 hadoop 集群中使用 tensorflow 模型运行风暴拓扑
- javascript - 使用 docker 时 Nodemon 不会重新加载
- google-chrome - 在 Chrome 中模拟会话超时/过期
- php - 如何获得 FPDF 总页数的一半?
- metatrader4 - MetaTrader 中的 ADX 计算