Toggle buttons in the toggle button example are missing accessible names

[mfairchild365]

What is the expected behavior?

All toggle buttons that contain a mat-icon in the example must have an accessible name.

What is the current behavior?

All toggle buttons that contain a mat-icon in the example do not have an accessible name.

What are the steps to reproduce?

1. Using either of the following screen readers
   • NVDA 2018.4.1 + FireFox 64
   • VoiceOver for IOS (12.1.3) + Safari
2. Open the toggle button example page
3. Press tab until you reach one of the toggle buttons
4. Observe that the button does not have an accessible name. Only the role and state are announced by the screen reader, for example, "toggle button not pressed".

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

• Angular Material Example 7.2.2 located at https://material.angular.io/components/
• NVDA 2018.4.1 + FireFox 64
• VoiceOver for IOS (12.1.3) + Safari (12.1.3)

Is there anything else we should know?

The documentation for buttons states the following:

Buttons or links containing only icons (such as mat-fab, mat-mini-fab, and mat-icon-button) should be given a meaningful label via aria-label or aria-labelledby.

The toggle button examples that contain only icons should be updated to reflect this advice.

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}