Many of the bindings can utilize a string property path, such as a Property Binding, or Indirect Tag Binding. Because of this, it can be helpful to understand how the paths work. This section details the various keywords and operators associated with these paths. Only properties on components in the same view are eligible to be used in this way. You may not have a binding refer to a property in another view instance, even view instances that may be embedded in your view. (Views may expose property values to their parent via output parameters.)
The format of the property path is like a file system path to get to the component combined with a dot-referenced object path to get to the property. The section referencing the property must begin with the property scope (e.g., "props" or "position" or "meta"). For the following examples, suppose we are designing a View with the following component hierarchy, and that each of these components has an "x", "y" property in "position", as well as a property called "complex" in "props" which is a map containing "foo", which is a number, and "bar" which is an array of numbers.
Slash Operator - When a path starts with this operator, then it defines an absolute path. That is, a path that starts at the top of the view hierarchy and is not relative to where the binding is being configured.
When not at the start of a path, the / operator moves further into a container, drilling further down into the hierarchy.
Dot Operator - You may access properties deep within a component's property document structure using the Dot Operator.
Assuming the component LabelA had a META property named "foo", then we could use the example on the right to retrieve the value of foo.
The Dot Operator can also be used to move further into a complex component. Assuming LabelA has object under META named "rotate", we can move into rotate with further use of the Dot Operator.
|Brackets - When referencing an array property, brackets allow you to specify an individual index within the array.|
Parent Container Operator - This operator acts as a shorthand reference to the parent container. Because the operator always returns the immediate parent container, the operator is relative to the component trying to utilize the operator.
When moving up in the hierarchy, multiple uses of this operator may be used in sequence to climb up multiple containers.
Alternatively, you may simply add additional dots to move up levels. Each additional dot moves up another level.
Container Self Operator - When configuring a binding from a container, this operator acts as a shorthand reference to the container. This is similar in concept to the this keyword, but still allows for the user of the other operators.
Note that this operator only works when the path is on a binding configured on a container.
The this keyword allows you to easily reference the same component the binding has been placed on.
This works on any object, including containers, views, and even the session.
|parent||Parent shortcut - References your immediate parent. This keyword is only valid when being evaluated from the scope of a component. For example, LabelA could reference the root container variables.|
Note that all of these shortcuts cannot be used with any other path separators, so a path like this/MyChild.position.x is invalid, for that, you'd use ./
View keyword - Refers to the view that a component is contained in. This is only valid when being evaluated from the scope of a component.
Lastly, the view shortcut references the view itself. Views may have input and output parameters, and to reference these parameters simply specify the category and name of the parameter, as shown in the example.
|page||Page keyword - refers to the page that the object is contained in. This is only valid when being evaluated from the scope of a view.|
|session||Session keyword - Refers to the session object. This keyword is valid from any object type.|
Direct Tag Example
Expression Tag Example 1
For this example, we created a static custom property. The comments in the example show the structure used.
Expression Tag Example 2
For this example we created an Expression Tag structure.
Weather Data Example
The following is an example showing weather data for Inductive Automation headquarters. The API contains detailed forecast information. In this example we use an Expression transform to capture just the current temperature.
The value is bound to a Label component on a view with some other information about Inductive Automation.