如何使用angular2 json架构表单创建一段字段？

Question

我正在使用https://github.com/dschnelldavis/angular2-json-schema-form,我的表单HTML是:

<json-schema-form
[schema]="schema"
(onSubmit)="exampleOnSubmitFn($event)">
</json-schema-form>

我schema是:

this.schema = {
  type: "object",
  properties: {
    CCN: {
      required: true,
      type: "number",
      minimum: 1000000000,
      maximum: 99999999999999999999
    },
    Quarter: {
      type: 'string',
      required: true,
      enum: ['Q1', 'Q2', 'Q3', 'Q4']
    },
    Year: {
      type: 'string',
      required: true,
      enum: ['2018', '2019', '2020']  
    },
    covered_medi: {
      title: "Covered by Medicare/Medicaid",
      type: "number",
      required: true
    },
    covered_private: {
      title: "Covered by private insurance",
      type: "number",
      required: true
    },
    Uninsured: {
      type: "number",
      required: true
    },
  }
}

我想要Quarter并且Year在一个单独的部分.我尝试使用该layout属性:

this.layout = [{
  type: "fieldset",
  title: "Reporting Period",
  items: [{
    key: "Quarter"
  }, {
    key: "Year"
  }]
}]

但这似乎行不通.

Answer 1

如果您已经安装并实例化了提供程序。唯一可能失败的是 schema、examples或回调，用空的进行测试。

ts

@Component({...})
export class MyComponent {

   public schema: any = {...}
   public onSubmit(event) {...}
   ... }

html

<json-schema-form
  [schema]="schema"
  (onSubmit)="onSubmit($event)">
</json-schema-form>

在此示例中，将所需的内容放入每个属性中。