A unit output (unitOutput) state variable represents a numeric value with multiple possible units. The app may provide the user a choice of their desired units for the number. The app can also choose which units it wants to compute with independent of the user's choice. Each rendered component will display according to the format and limits specified for the chosen unit in the state variable.
The unit input contains several child numericOutput state variables, one for each unit is supports. Each child state variable is published with a subName corresponding to its unit (e.g., 'myPage_mySv_kg' and 'myPage_mySv_lb'). When one child state variable changes, the others are updated with the new value converted to their respective units.
Each unit input has an associated unitClass string. Each unitClass is associated with a unitSelector state variable. The unitSelector state variable controls which unit each rendered component will be displayed to the user. Many unitInput state variables can have the same unitClass, and, therefore will be controlled by the same unitSelector.
The unitOutput state variable's component instance will display the currently selected unit sibling. If the showUnits attribute or the '{{...@}}' template syntax is used, the component will also display the appropriate unit abbreviations for the currently selected unit.
The app code or a component template may also refer to a specific child numericOutput state variable. Any modification to that child will also update its siblings with converted values.
unitOutput', class: UnitOutputSvctl.createPage({
...,
stateVarInfo:[
{type:'unitOutput', ...},
],
})
info
An object containing the state variable properties. The info object can contain the following properties, but subclasses of StateVar may have additional properties:
info properties.info properties.info properties.unitClassunitClass string for the unitSelector that controls which unit sibling is current for this state variable.unitsinfo object.The object for each unit has the following keys:
fmt (optional)
The fmt parameter can be one of the following:
fmtStr). If a format string is used, then a NumFmt instance will be created using this string along with any info.min and info.amx parameters. If no fmt is provided, a format string of '8' is assumed.
Note: The component() method returns a NumOutputSvCmp.
isNumberAlways true for unitOutput.
A Boolean.
isUnitAlways true for unitOutput.
A Boolean.
isUnitParentAlways true for unitOutput.
A Boolean.
unitClassThe unitClass string for the unitSelector that controls which unit sibling is current for this state variable.
A String.
<span> with the value attribute set according to the current unit sibling value.<span> contents will be synchronized with the current unit sibling value.<span> element will have a className that contains 'svIo_unitOutput'.