[AngularJS] Angular 1.3 ngAria - 2

This is an highlight about ngAira in Angular Document abou ngAira

 

Where can use ngAria?

---

 

Currently, ngAria interfaces with the following directives:

• ngModel
• ngDisabled
• ngShow
• ngHide
• ngClick
• ngDblClick

 

ngModel

---

 

For those elements using ngModel, ngAria will dynamically bind and update the following ARIA attributes (if they have not been explicitly specified by the developer):

• aria-checked
• aria-valuemin
• aria-valuemax
• aria-valuenow
• aria-invalid
• aria-required

Example:

<md-checkbox ng-model="val" required>

to:

<md-checkbox ng-model="val" required aria-required="true" tabIndex="0">

ngAria will also add tabIndex, ensuring custom elements with these roles will be reachable from the keyboard.

As a rule, any time you create a widget involving user interaction, be sure to test it with your keyboard and at least one mobile and desktop screen reader (preferably more).

 

ngDisabled

---

 

The disabled attribute is only valid for certain elements such as button, input and textarea. 

Example:

<md-checkbox ng-disabled="disabled">

to:

<md-checkbox disabled aria-disabled="true">