Badge

API reference for Angular Material badge

import {MatBadgeModule} from '@angular/material/badge';

Directives

`MatBadge`

Directive to display a text badge.

Selector: [matBadge]

Properties

Name	Description
@Input('matBadgeColor') `color: ThemePalette`	The color of the badge. Can be `primary`, `accent`, or `warn`.
@Input('matBadge') `content: string`	The content for the badge
@Input('matBadgeDescription') `description: string`	Message used to describe the decorated element via aria-describedby
@Input('matBadgeHidden') `hidden: boolean`	Whether the badge is hidden.
@Input('matBadgeOverlap') `overlap: boolean`	Whether the badge should overlap its contents or not
@Input('matBadgePosition') `position: MatBadgePosition`	Position the badge should reside. Accepts any combination of 'above'\|'below' and 'before'\|'after'
@Input('matBadgeSize') `size: MatBadgeSize`	Size of the badge. Can be 'small', 'medium', or 'large'.

Methods

isAbove
Whether the badge is above the host or not
Returns
`boolean`

isAfter
Whether the badge is after the host or not
Returns
`boolean`

Additional type aliases

`MatBadgePosition`

Type: 'above after' | 'above before' | 'below before' | 'below after'

`MatBadgeSize`

Type: 'small' | 'medium' | 'large'