OnsSwitch Directive (ons-switch)

Angular directive for <ons-switch> component.

Switch component. The switch can be toggled both by dragging and tapping. Will automatically displays a Material Design switch on Android devices.


Tutorial will be added soon.

See also

Name Type Description
modifier String The appearance of the switch. Optional.
disabled Whether the switch is be disabled. Optional.
checked Whether the switch is checked. Optional.
input-id String Specify the id attribute of the inner <input> element. This is useful when using <label for="..."> elements. Optional.
Name Description
checked This value is true if the switch is checked.
value The current value of the input.
disabled Whether the element is disabled or not.
checkbox The underlying checkbox element.
Name Description
material Material Design switch
Signature Description
focus() Focuses the switch.
blur() Removes focus from the switch.

Focuses the switch.


Removes focus from the switch.


Name Type Description
value Specify the value of the <ons-switch> component.


Name Type Description
valueChange Triggers when the value is changed.

Need Help?

If you have any questions, use our Community Forum or talk to us on Discord chat. The Onsen UI team and your peers in the community will work together to help solve your issues.

For bug reports and feature requests use our GitHub Issues page.