ptcs-behavior-binary¶
Overview¶
A binary visual representation can be in on or off state. When the UI element is activated it toggles state.
Usage Examples¶
Can be seen in: ptcs-checkbox and ptc-toggle-button
Example for ptcs-checkbox:
Basic Usage¶
<ptcs-checkbox variable="{{show}}">Show</ptcs-checkbox>
Assigns the variable show to true whenever the checkbox state becomes on, and to false whenever it becomes off.
Start in on state (checked)¶
<ptcs-checkbox variable="{{show}}" checked>Show</ptcs-checkbox>
Explicit variable values¶
<ptcs-checkbox variable="{{tool}}" value-on="knife" value-off="fork">Use tool</ptcs-checkbox>
Assigns the variable tool to "knife" whenever the checkbox is on and "fork" otherwise.
Component API¶
Properties¶
| Property | Type | Description | Triggers a changed event |
|---|---|---|---|
| checked | Boolean | Current element state (on = true, off = false) | Yes |
| disabled | Boolean | Is the element disabled? | No |
| state | Boolean | Same like "checked" but not reflected to attribute | No |
| valueOff | any | The value that the element assigns to variable when the element is turned off. Default: false | No |
| valueOn | any | The value that the element assigns to variable when the element is turned on. Default: true | No |
| variable | any | The variable that the element monitors and assigns | Yes |
Methods¶
No methods
State attributes¶
| Attribute | Description | Part |
|---|---|---|
| checked | Current element state (on = true, off = false) | :host |
| disabled | Is the element disabled? | :host |