使用Angular 2从JSON动态创建带有输入控件的表单

Question

我需要使用Angular 2.0从JSON动态创建一个带控件的表单。

我是Angular 2.0和Typescript的新手。我完全无能为力，从哪里开始发展。

非常感谢任何帮助。

以下是示例JSON

IDEDerivedDataPathOverride = /Users/[MY_USER]/Documents/projects/new-app/ios/build

Answer 1

创建动态表单组并循环遍历json并创建相应的元素，其中表单输入类型及其相关属性（如名称，值，占位符，类型，必需，模式等）根据资源的属性而变化。所以在运行时渲染表单。

参考资料

Creating forms in angular 2 using json schema at run time

Answer 2

您需要从@ angular / forms导入FormBuilder。然后创建一个FormGroup。

public form: FormGroup;

private _buildForm() {
  let obj = {};
  General['None'].forEach(val => {
    obj[val.fieldname] = new FormControl('', Validators.required);
  });

  _fb.group(obj);

}

在模板上，您需要遍历表单控件，然后根据类型创建表单。

这个答案可能无法为您提供所需的所有答案，但它让您大开眼界。

您可能希望使用FormArrays，具体取决于您希望如何实现。

阅读表格上的angular2文档。另请观看此视频。

Angular 2 Forms | Kara Erickson - YouTube

Forms - ts - GUIDE - Angular