API reference for Angular Material button-toggle

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

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:

Selected button toggles in the group.

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

Deprecated

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.

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

Acceptable types for a button toggle.

type ToggleType = 'checkbox' | 'radio';

Possible appearance styles for the button toggle.

type MatButtonToggleAppearance = 'legacy' | 'standard';

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>;