API reference for Angular Material slide-toggle

import {MatSlideToggleModule} from '@angular/material/slide-toggle';

Directives

`MatSlideToggle`

Represents a slidable "switch" toggle that can be moved between on and off.

Selector: mat-slide-toggle

Exported as: matSlideToggle

Properties

Name	Description
@Input('aria-describedby') `ariaDescribedby: string`	Used to set the aria-describedby attribute on the underlying input element.
@Input('aria-label') `ariaLabel: string \| null`	Used to set the aria-label attribute on the underlying input element.
@Input('aria-labelledby') `ariaLabelledby: string \| null`	Used to set the aria-labelledby attribute on the underlying input element.
@Input() `checked: boolean`	Whether the slide-toggle element is checked or not.
@Input() `color: ThemePalette`	Theme color palette for the component.
@Input() `disableRipple: boolean`	Whether ripples are disabled.
@Input() `disabled: boolean`	Whether the component is disabled.
@Input() `id: string`	A unique id for the slide-toggle input. If none is supplied, it will be auto-generated.
@Input() `labelPosition: 'before' \| 'after'`	Whether the label should appear after or before the slide-toggle. Defaults to 'after'.
@Input() `name: string \| null`	Name value will be applied to the input element if present.
@Input() `required: boolean`	Whether the slide-toggle is required.
@Output() `change: EventEmitter<MatSlideToggleChange>`	An event will be dispatched each time the slide-toggle changes its value.
@Output() `toggleChange: EventEmitter<void>`	An event will be dispatched each time the slide-toggle input is toggled. This event is always emitted when the user toggles the slide toggle, but this does not mean the slide toggle's value has changed.
`defaultColor: ThemePalette \| undefined`	Default color to fall back to if no value is set.
`defaultTabIndex: number`	Tabindex to which to fall back to if no value is set.
`defaults: MatSlideToggleDefaultOptions`
`inputId: string`	Returns the unique id for the visual hidden input.

Methods

focus
Focuses the slide-toggle.
Parameters
options? `FocusOptions`
origin? `FocusOrigin`

toggle
Toggles the checked state of the slide-toggle.

`MatSlideToggleRequiredValidator`

Validator for Material slide-toggle components with the required attribute in a template-driven form. The default validator for required form controls asserts that the control value is not undefined but that is not appropriate for a slide-toggle where the value is always defined.

Required slide-toggle form controls are valid when checked.

Selector: mat-slide-toggle[required][formControlName] mat-slide-toggle[required][formControl] mat-slide-toggle[required][ngModel]

Properties

Name	Description
`required: boolean \| string`	Tracks changes to the required attribute bound to this directive.

Methods

registerOnValidatorChange
Registers a callback function to call when the validator inputs change.
Parameters
fn `() => void`

validate
Method that validates whether or not the checkbox has been checked. Returns the validation result if enabled, otherwise null.
Parameters
control `AbstractControl`
Returns
`ValidationErrors \| null`

Classes

`MatSlideToggleChange`

Change event object emitted by a MatSlideToggle.

Properties

Name	Description
`checked: boolean`	The new `checked` value of the MatSlideToggle.
`source: MatSlideToggle`	The source MatSlideToggle of the event.

Interfaces

`MatSlideToggleDefaultOptions`

Default mat-slide-toggle options that can be overridden.

Properties

Name	Description
`color: ThemePalette`	Default color for slide toggles.
`disableToggleValue: boolean`	Whether toggle action triggers value changes in slide toggle.

Constants

`MAT_SLIDE_TOGGLE_DEFAULT_OPTIONS`

Injection token to be used to override the default options for mat-slide-toggle.

const MAT_SLIDE_TOGGLE_DEFAULT_OPTIONS: InjectionToken<MatSlideToggleDefaultOptions>;

`MAT_SLIDE_TOGGLE_REQUIRED_VALIDATOR`

const MAT_SLIDE_TOGGLE_REQUIRED_VALIDATOR: Provider;