Toggle 1 Toggle 2 Toggle 3 Large Toggle

toggleSwitches.option1 is {{ toggleSwitches.option1 }}. toggleSwitches.option2 is {{ toggleSwitches.option2 }}. toggleSwitches.option3 is {{ toggleSwitches.option3 }}. toggleSwitches.option4 is {{ toggleSwitches.option4 }}.


To create a toggle switch, use the toggleswitch component with the value attribute to bind the value. Use disabled to control the disabled state.

The code used for the above example is shown below:

In an Angular application, ngModel may be used to bind the control to a form.

Binding for the state of the switch; true for "on" and false for "off." If this value is set to true then the toggle switch will be disabled. If set to false the switch will not be updated when clicking on it, can be used if something else is updating the state of the switch. If set to true the toggle switch will be marked as required. Emits when value has been changed.