Comment on page
Working with outport schemas
This tutorial shows what UI improvements you can get when defining outport schemas for the data coming out from your components. First imagine we have a NewPerson component with the following outport definition:
"outPorts": [
{
"name": "person",
"schema": {
"type": "object",
"properties": {
"name": {
"type": "object",
"title": "Name",
"properties": {
"firstName": { "type": "string", "title": "First Name" },
"lastName": { "type": "string" }
}
},
"addresses": {
"type": "array",
"title": "Addresses",
"items": {
"type": "object",
"properties": {
"street": {
"type": "string",
"title": "Street"
},
"city": {
"type": "string",
"title": "City"
},
"country": {
"type": "string",
"title": "Country"
},
"number": {
"type": "number",
"title": "Number"
}
}
}
}
}
}
}
]
As you can see, the data coming out from the component is an object with two properties:
name
, which is an object with two string properties, and addresses
which is an array of objects, and each object has (properties go here). This two cover the most common cases where schemas are useful to make easier for the user to work with the data.One of the use cases is to be able to access nested properties in a variable, if that variable has its type as object and has its schema defined. In our example, the name variable has two nested properties: firstname and lastname. So when we connect a component to the output of our NewPerson component, we will be able to select the nested properties directly:

Nested properties available directly in Inspector
Another use case is when using array data, like the addresses property in our example, we can access directly to the properties of each item when using a modifier that iterates over an array (Each, Map, Filter...):

Modify a variable of type array

Array item properties available on iteration modifiers
You can also get additional information from array items in non-iterator modifiers. When using a non-iterator modifier, you get the name of the properties in the variables list. This is useful when you get only one element of the input array variable and want to access some property. Take this alternative modifier arrangement for the
Addresses
variable as an example:
Property names for array items
As you can see, we take the first item of the array, and now we want to access a property from this item, so we use the
JSON Path
modifier. In the variables list we can see that the property names are there. It is very important to note that this are just the property names, not the actual values inside the item. So for example the variable street
will be evaluated to the string "street", and this will work fine in our example because we are using the JSON Path
modifier.Last modified 4mo ago