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
Continue with Angular
Save the full cheat sheet or work through every related task.