API reference for Angular Material button-toggle

import {MatButtonToggleModule} from '@angular/material/button-toggle';

Directives

`MatButtonToggleGroup`

Exclusive selection button toggle group that behaves like a radio-button group.

Selector: mat-button-toggle-group

Exported as: matButtonToggleGroup

Properties

Name	Description
@Input() `appearance: MatButtonToggleAppearance`	The appearance for all the buttons in the group.
@Input() `disabled: boolean`	Whether multiple button toggle group is disabled.
@Input() `multiple: boolean`	Whether multiple button toggles can be selected.
@Input() `name: string`	`name` attribute for the underlying `input` element.
@Input() `value: any`	Value of the toggle group.
@Input() `vertical: boolean`	Whether the toggle group is vertical.
@Output() `change: EventEmitter<MatButtonToggleChange>`	Event emitted when the group's value changes.
`selected: MatButtonToggle \| MatButtonToggle[]`	Selected button toggles in the group.

`MatButtonToggle`

Single button inside of a toggle group.

Selector: mat-button-toggle

Exported as: matButtonToggle

Properties

Name	Description
@Input() `appearance: MatButtonToggleAppearance`	The appearance style of the button.
@Input('aria-label') `ariaLabel: string`	Attached to the aria-label attribute of the host element. In most cases, aria-labelledby will take precedence so this may be omitted.
@Input('aria-labelledby') `ariaLabelledby: string \| null`	Users can specify the `aria-labelledby` attribute which will be forwarded to the input element
@Input() `checked: boolean`	Whether the button is checked.
@Input() `disableRipple: boolean`	Whether ripples are disabled.
@Input() `disabled: boolean`	Whether the button is disabled.
@Input() `id: string`	The unique ID for this button toggle.
@Input() `name: string`	HTML's 'name' attribute used to group radios for unique selection.
@Input() `value: any`	MatButtonToggleGroup reads this to assign its own value.
@Output() `change: EventEmitter<MatButtonToggleChange>`	Event emitted when the group value changes.
`buttonId: string`	Unique ID for the underlying `button` element.
`buttonToggleGroup: MatButtonToggleGroup`	The parent button toggle group (exclusive selection). Optional.

Methods

focus
Focuses the button.
Parameters
options? `FocusOptions`

Classes

`MatButtonToggleChange`

Change event object emitted by MatButtonToggle.

Properties

Name	Description
`source: MatButtonToggle`	The MatButtonToggle that emits the event.
`value: any`	The value assigned to the MatButtonToggle.

Interfaces

`MatButtonToggleDefaultOptions`

Represents the default options for the button toggle that can be configured using the MAT_BUTTON_TOGGLE_DEFAULT_OPTIONS injection token.

Properties

Name	Description
`appearance: MatButtonToggleAppearance`	Default appearance to be used by button toggles. Can be overridden by explicitly setting an appearance on a button toggle or group.

Type aliases

`ToggleType`

Deprecated

type ToggleType = 'checkbox' | 'radio';

`MatButtonToggleAppearance`

Possible appearance styles for the button toggle.

type MatButtonToggleAppearance = 'legacy' | 'standard';

Constants

`MAT_BUTTON_TOGGLE_DEFAULT_OPTIONS`

Injection token that can be used to configure the default options for all button toggles within an app.

const MAT_BUTTON_TOGGLE_DEFAULT_OPTIONS: InjectionToken<MatButtonToggleDefaultOptions>;

`MAT_BUTTON_TOGGLE_GROUP`

Injection token that can be used to reference instances of MatButtonToggleGroup. It serves as alternative token to the actual MatButtonToggleGroup class which could cause unnecessary retention of the class and its component metadata.

const MAT_BUTTON_TOGGLE_GROUP: InjectionToken<MatButtonToggleGroup>;