dschnelldavis/angular2-json-schema-form

Nested array form issue

thoussem opened this issue · 0 comments

  • MaterialDesignFrameworkModule — Material Design
  • Bootstrap3FrameworkModule — Bootstrap 3
  • Bootstrap4FrameworkModule — Bootstrap 4
  • NoFrameworkModule — plain HTML
  • Other (please specify below)

The array items of the second lavel (nested arrays second lavel) are not visible.

To Reproduce
Use this schema:

{
  "schema": {
    "type": "object",
    "properties": {
      "servicePaths": {
        "type": "array",
        "description": "Configuration of the REST services to call",
        "items": {
          "type": "object",
          "properties": {
            "url": {
              "type": "string",
              "editable": true
            },
            "httpMethod": {
              "type": "string",
              "enum": ["GET", "POST", "PUT", "DELETE"]
            },
            "params": {
              "type": "array",
              "items": {
                "type": "object",
                "properties": {
                  "param": {
                    "type": "string"
                  },
                  "paramType": {
                    "type": "string",
                    "description": "The type of the web service parameter, keep it empty if you are using a swagger file, it will be automatically checked",
                    "enum": ["Query param", "Path param"]
                  },
                  "type": {
                    "type": "string",
                    "enum": ["Query param", "Path param", "Field", "Static"]
                  },
                  "value": {
                    "type": "string"
                  }
                }
              }
            },
            "condition": {
              "type": "object",
              "description": "Properties to configure a condition",
              "properties": {
                "expression": {
                  "type": "string",
                  "description": "The expression to evaluate",
                  "evaluate": true
                },
                "calculationBase": {
                  "type": "array",
                  "description": "The list of the dependents fields used in the expression",
                  "items": {
                    "type": "string"
                  }
                }
              }
            }
          }
        }
      },
      "multipleRow": {
        "type": "boolean",
        "description": "Display the button for more than one item selected within a grid"
      },
      "messages": {
        "type": "array",
        "description": "Configuration of the messages to be displayed",
        "items": {
          "type": "object",
          "properties": {
            "key": {
              "type": "string",
              "description": "The unique identifier of the message"
            },
            "content": {
              "type": "string",
              "description": "To specify the content to display"
            },
            "step": {
              "type": "string",
              "description": "Display message before or after executing the action process",
              "enum": ["beforeExecute", "afterExecute"]
            },
            "type": {
              "type": "string",
              "description": "Message type to display",
              "enum": ["Success", "Error", "Warning", "Info", "Confirmation"]
            }
          }
        }
      },
      "template": {
        "type": "string",
        "description": "Template of the button",
        "enum": [
          "empty",
          "create",
          "save",
          "select",
          "apply",
          "cancel",
          "edit",
          "search",
          "edit-item",
          "view-item",
          "delete-item",
          "delete-items",
          "save-items",
          "export",
          "run-lifecycle",
          "refresh"
        ]
      },
      "additionalAttributes": {
        "type": "array",
        "description": "Component additional attributes",
        "items": {
          "type": "object",
          "properties": {
            "name": {
              "type": "string"
            },
            "type": {
              "type": "string",
              "enum": ["static", "variable"],
              "default": "static"
            },
            "value": {
              "type": "string"
            }
          }
        }
      }
    },
    "required": ["template"]
  },
  "layout": [
    {
      "items": [
        {
          "type": "fieldset",
          "expandable": true,
          "title": "Web services",
          "items": [
            {
              "key": "servicePaths",
              "type": "array",
              "notitle": true,
              "items": [
                {
                  "type": "div",
                  "displayFlex": true,
                  "flex-direction": "row",
                  "items": [
                    {
                      "type": "fieldset",
                      "expandable": true,
                      "title": "Service Path",
                      "items": [
                        {
                          "key": "servicePaths[].url",
                          "placeholder": "url",
                          "title": "Url",
                          "value": "$FeatureServicesPaths"
                        },
                        {
                          "key": "servicePaths[].httpMethod",
                          "placeholder": "http Method",
                          "title": "Http Method"
                        },
                        {
                          "key": "servicePaths[].params",
                          "type": "array",
                          "notitle": true,
                          "items": [
                            {
                              "type": "div",
                              "displayFlex": true,
                              "flex-direction": "row",
                              "items": [
                                {
                                  "type": "fieldset",
                                  "expandable": true,
                                  "title": "Binding WS params",
                                  "items": [
                                    {
                                      "key": "servicePaths[].params[].param",
                                      "value": "$ServiceParameters",
                                      "title": "WS Parameter Name",
                                      "deps": [
                                        "servicePaths[].url",
                                        "servicePaths[].httpMethod"
                                      ]
                                    },
                                    {
                                      "key": "servicePaths[].params[].paramType",
                                      "title": "WS Parameter Type"
                                    },
                                    {
                                      "key": "servicePaths[].params[].type",
                                      "title": "Value Type"
                                    },
                                    {
                                      "key": "servicePaths[].params[].value",
                                      "title": "Value"
                                    }
                                  ]
                                }
                              ]
                            }
                          ]
                        },
                        {
                          "type": "fieldset",
                          "expandable": true,
                          "title": "Condition",
                          "items": [
                            {
                              "key": "servicePaths[].condition.expression",
                              "placeholder": "expression",
                              "title": "Expression"
                            },
                            {
                              "key": "servicePaths[].condition.calculationBase",
                              "type": "array",
                              "autoCalculate": "$ExpressionParser",
                              "items": [
                                "servicePaths[].condition.calculationBase[]"
                              ],
                              "deps": "servicePaths[].condition.expression",
                              "condition": {
                                "functionBody": "{return false}"
                              }
                            }
                          ]
                        }
                      ]
                    }
                  ]
                }
              ]
            }
          ]
        }
      ]
    }
  ],
  "data": {
    "servicePaths": [
      {
        "url": "ur1",
        "params": [
          {
            "param": "param1"
          },
          {
            "param": "param2"
          },
          {
            "param": "param3"
          }
        ]
      },
      {
        "url": "url2"
      }
    ],
    "template": "save",
    "additionalAttributes": [
      {
        "type": "static"
      }
    ]
  }
}

In the data section:

{
    "servicePaths": [
      {
        "url": "ur1",
        "params": [
          {
            "param": "param1"
          },
          {
            "param": "param2"
          },
          {
            "param": "param3"
          }
        ]
      },
      {
        "url": "url2"
      }
    ],
    "template": "save",
    "additionalAttributes": [
      {
        "type": "static"
      }
    ]
  }

I have 2 service paths "url1" and "url2", the "url1" have 3 params "param1", "param2" and "param3"
Only the param1 is visible in the form:
param_hidden
When I click add params it add param filled with the "param2".

Expected behavior
All of the 3 prams are visible:
params

Desktop (please complete the following information):

  • OS: Windows 10
  • Browser : Chrome
  • Version : 13.1.3

I reproduce the issue here:
https://stackblitz.com/edit/deep-arrayform

Thanks for your help.