如何使用角度 json 模式表单创建多个表单选项卡？答案

【问题标题】：How to create multiple tabs of forms using angular json schema form?如何使用角度 json 模式表单创建多个表单选项卡？
【发布时间】：2023-03-13 18:19:01
【问题描述】：

我已经成功地使用了这个很棒的库和名为 json 模式表单的概念。

https://www.npmjs.com/package/angular2-json-schema-form

现在使用给定的模式模式，我能够基于从数据库动态创建的模式生成表单。我想在多个选项卡中转换单个表单。 IE 我想在一个面板中对某些类型的字段进行分组。

是否有对此功能的任何支持？这样我就可以根据布局分配css类。

https://angular2-json-schema-form.firebaseapp.com/?set=ng-jsf&example=ng-jsf-flex-layout&framework=material-design&language=en

【问题讨论】：

我能够在一个差异中获得表格。传奇，如何强制他们进入班级？？？

标签： css angular angular-schema-form

【解决方案1】：

您可以使用 fieldsets 属性将一组字段拆分为单独的选项卡。请参阅README.md 中的以下示例：

{
  "properties": {
    "firstName": {
      "type": "string",
      "description": "First name"
    },
    "lastName": {
      "type": "string",
      "description": "Last name"
    },
    "email": {
      "type": "string",
      "description": "Email"
    },
    "notificationsFrequency": {
      "type": "string",
      "description": "Notifications frequency",
      "widget": "select",
      "oneOf": [
        {
          "description": "Daily",
          "enum": [
            "daily"
          ]
        },
        {
          "description": "Weekly",
          "enum": [
            "weekly"
          ]
        },
        {
          "description": "Monthly",
          "enum": [
            "monthly"
          ]
        }
      ],
      "default": "daily"
    }
  },
  "fieldsets": [
    {
      "title": "Personal information",
      "fields": [
        "firstName",
        "lastName",
        "email"
      ]
    },
    {
      "title": "Account settings",
      "fields": [
        "notificationsFrequency"
      ]
    }
  ]
}

【讨论】：