elementLabelProp - access nested property

General
1

Hello,

When array uses non-primitives it renders as list of folded sections. Documentation says taht every section can be named with property by using “elementLabelProp” option.

https://lodash.com/docs/4.17.15#get

But it is unclear for me how to acces property of nested element. For example if array contains nested objects like:

{
    "type": "object",
    "properties": {
        "nested1": {
            "type": "object",
            "properties": {
                "nested1-name": {
                    "type": "string"
                }
            }
        },
        "nested2": {
            "type": "object",
            "properties": {
                "nested2-2": {
                    "type": "object",
                    "properties": {
                        "nested2-2-name": {
                            "type": "string"
                        }
                    }
                }
            }
        }
    }
}

How to access “nested2/nested2-2/nested2-2-name”? Please provide any tip.

2

Hi @mynthon,

In React Material nested2.nested2-2.nested2-2-name should do the trick.

3

And in ui-schema path should start from “scope” or from “root”

{
    "type": "Categorization",
    "elements": [
        {
            "type": "Category",
            "elements": [
                {
                    "type": "Control",
                    "scope": "#/properties/sampleData",
                    "options": {
                        "showSortButtons": true,
                        "detail": {
                            "elementLabelProp": "nested2.nested2-2.nested2-2-name",
                            "type": "VerticalLayout",
                            "elements": [
                                {
                                    "type": "Control",
                                    "scope": "#/properties/nested1"
                                },
                                {
                                    "type": "Control",
                                    "scope": "#/properties/nested2"
                                }                              
                            ]
                        }
                    }
                }
            ]
        }
    ]
}
4

Ok, I’ll will answer to myself. There is an error in my code and thats why it wouldn’t work.
“elementLabelProp” address is relative to scope BUTproperty must be included inside “options” object, not inside “options.details”.

1 Like