首页 > 解决方案 > 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);
      }
    }

谁能帮我从提交的表单中获取数据?我可以在表单外的另一个分区和按钮上执行此操作吗?我想使用我自己的提交按钮。或者是否有任何教程可以从数据库设计开始解释这一点?

标签: javascriptangularforms

解决方案


推荐阅读