Accessibility (A11y) in Angular
From the Angular cheat sheet Ā· Accessibility Ā· verified Jul 2026
Accessibility (A11y)
ARIA attributes and CDK A11y utilities
typescript
// Basic ARIA attributes
@Component({
template: \`
<button [attr.aria-label]="buttonLabel"
[attr.aria-pressed]="isPressed"
[attr.aria-disabled]="isDisabled">
{{ buttonText }}
</button>
<div role="alert" aria-live="polite">
{{ statusMessage }}
</div>
\`
})
export class AccessibleComponent {
buttonLabel = 'Submit form';
isPressed = false;
isDisabled = false;
statusMessage = '';
}š” Always use semantic HTML elements when possible
ā” CDK A11y provides utilities for focus management and live announcements
š Use ARIA attributes to provide context for screen readers
š„ Test with keyboard navigation and screen readers