Improve this Doc View Source

## Overview

The $aria service contains helper methods for applying common ARIA attributes to HTML directives.

ngAria injects common accessibility attributes that tell assistive technologies when HTML elements are enabled, selected, hidden, and more. To see how this is performed with ngAria, let's review a code snippet from ngAria itself:

    ngAriaModule.directive('ngDisabled', ['$aria', function($aria) {
      return $aria.$$watchExpr('ngDisabled', 'aria-disabled', nativeAriaNodeNames, false);
    }])

Shown above, the ngAria module creates a directive with the same signature as the traditional `ng-disabled` directive. But this ngAria version is dedicated to solely managing accessibility attributes on custom elements. The internal `$aria` service is used to watch the boolean attribute `ngDisabled`. If it has not been explicitly set by the developer, `aria-disabled` is injected as an attribute with its value synchronized to the value in `ngDisabled`.

Because ngAria hooks into the `ng-disabled` directive, developers do not have to do anything to enable this feature. The `aria-disabled` attribute is automatically managed simply as a silent side-effect of using `ng-disabled` with the ngAria module.

The full list of directives that interface with ngAria:

- ngModel
- ngChecked
- ngReadonly
- ngRequired
- ngDisabled
- ngValue
- ngShow
- ngHide
- ngClick
- ngDblclick
- ngMessages

Read the ngAria Developer Guide for a thorough explanation of each directive.

## Dependencies

Requires the `ngAria` module to be installed.