chore: add skip navigation link for a11y demo (#6423)

Author: tinayuangao

src/demo-app/a11y/a11y.html

@@ -1,9 +1,12 @@
 <h1>Accessibility Demo</h1>
 
 <nav>
+  <a (click)="skipNavigation()" href="javascript:void(0)">Skip navigation</a>
   <a *ngFor="let navItem of navItems" [routerLink]="[navItem.route]">
     {{navItem.name}}
   </a>
 </nav>
 
-<router-outlet></router-outlet>
+<div #maincontent tabindex="0">
+  <router-outlet></router-outlet>
+</div>

src/demo-app/a11y/a11y.ts

@@ -1,4 +1,4 @@
-import {Component, ViewEncapsulation} from '@angular/core';
+import {Component, ElementRef, ViewChild, ViewEncapsulation} from '@angular/core';
 
 @Component({
   moduleId: module.id,
@@ -15,6 +15,8 @@ export class AccessibilityHome {}
   encapsulation: ViewEncapsulation.None,
 })
 export class AccessibilityDemo {
+  @ViewChild('maincontent') mainContent: ElementRef;
+
   navItems = [
     {name: 'Home', route: '.'},
     {name: 'Autocomplete', route: 'autocomplete'},
@@ -37,4 +39,9 @@ export class AccessibilityDemo {
     {name: 'Select', route: 'select'},
     {name: 'Toolbar', route: 'toolbar'},
   ];
+
+  skipNavigation() {
+    this.mainContent.nativeElement.scrollIntoView();
+    this.mainContent.nativeElement.focus();
+  }
 }