Binding Property Path Reference
Perspective component bindings can reference the value of other properties. These references take the form of a relative path that leads to the referenced property.
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.
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.
- View
- root
- LabelA
- LabelB
- Sub_Container1
- ButtonA
- ButtonB
- Sub_Container2
- ButtonA
- ButtonB
- root
Operator/Keyword | Description | Example |
---|---|---|
/ | 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. |
Move Up Multiple Parent Containers
|
./ | 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: This operator only works when the path is on a binding configured on a container. |
|
this | 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. 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 | 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. | view.params.paramName |
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. Useful in cases where a binding needs to reference session properties. Note: Normally, bindings can not reference properties on components in other views. However, views can use custom session properties as a means of sharing or synchronizing a value. |