Question

我使用此教程创建了一个DynamicForm项目，并且效果很好。

https://medium.com/@mail.bahurudeen/create-a-dynamic-form-with-configurable-fields-and-validations-using-angular-6-994db56834da

现在，我想使用一台最初提供表单状态并对表单中的更改做出反应的服务器。

因此，我从服务器请求表格的初始格式，并像这样更改了AppComponent。

export class AppComponent implements OnInit {

  @ViewChild(DynamicFormComponent) form: DynamicFormComponent;
  regConfig: FieldConfig[] = [];

  constructor(private http: HttpClient) {
  }

  ngOnInit() {
    this.getForm();
  }

  valueChange(value) {
    this.getForm(value.name);
  }

  getForm(name?) {
    let myParams = new HttpParams().set('lang', 'de');
    if (!!name) {
      myParams = myParams.set('name', name);
    }
    this.http.get('http://10.9.99.128:8080', {params: myParams})
      .subscribe((value) => {
        this.regConfig = value['formControls'];
      });
  }
}

和DynamicFormComponent对此：

export class DynamicFormComponent implements OnChanges {

  @Input() fields: FieldConfig[] = [];
  @Output() submit: EventEmitter<any> = new EventEmitter<any>();

  form: FormGroup = this.fb.group({});

  constructor(private fb: FormBuilder) {
  }

  ngOnChanges() {
    this.form = this.createControl();
    this.form.valueChanges.subscribe((value) => {
      this.submit.emit(value);
    });
  }
}

现在，我遇到的问题是，输入值后，我会将请求发送到服务器，服务器以新的表单表示形式进行响应。但是，由于它是一种全新的形式，因此当前领域将失去其重点。特别是对于输入字段，您必须在每个字母之后再次单击该字段。

我如何创建一个动态表单，由服务器确定显示哪些字段，哪些不取决于输入值？

最诚挚的问候

服务器响应中的动态表格

0 个答案: