address comments

Author: tinayuangao

src/demo-app/a11y/list/list-a11y.html

@@ -20,7 +20,7 @@ <h2>Mailbox navigation</h2>
   </section>
 
   <section>
-    <h2>Messages </h2>
+    <h2>Messages</h2>
     <p>
       Showing a list of messages, where each message item has sender's name, sender's avatar,
       message subject, and content of the message.
@@ -37,7 +37,7 @@ <h3 md-line> {{message.from}} </h3>
   </section>
 
   <section>
-    <h2> Seasoning</h2>
+    <h2>Seasoning</h2>
     <p>Showing a non-interactive list of seasonings with dense style.</p>
     <md-list dense>
       <md-list-item *ngFor="let item of items"> {{item}} </md-list-item>

src/demo-app/a11y/list/list-a11y.ts

@@ -13,7 +13,7 @@ export class ListAccessibilityDemo {
     'Paprika'
   ];
 
-  messages: any[] = [
+  messages = [
     {
       from: 'Nancy',
       subject: 'Brunch?',
@@ -34,21 +34,21 @@ export class ListAccessibilityDemo {
     }
   ];
 
-  links: any[] = [
+  links = [
     {name: 'Inbox'},
     {name: 'Outbox'},
     {name: 'Spam'},
     {name: 'Trash'}
 
   ];
 
-  folders: any[] = [
+  folders = [
     {name: 'Imported', updated: 'Miles'},
     {name: 'Important', updated: 'Tina'},
     {name: 'Unread', updated: 'Jeremy'},
   ];
 
-  notes: any[] = [
+  notes = [
     {name: 'Update screenshots', updated: 'Kara'},
     {name: 'Install new application', updated: 'Andrew'},
   ];

src/lib/list/index.ts

@@ -16,8 +16,6 @@ import {
   MdNavList,
   MdListAvatarCssMatStyler,
   MdListIconCssMatStyler,
-  MdListCssMatStyler,
-  MdNavListCssMatStyler,
   MdDividerCssMatStyler,
   MdListSubheaderCssMatStyler
 } from './list';
@@ -35,8 +33,6 @@ import {MdSelectionList, MdListOption} from './selection-list';
     MdLineModule,
     MdCommonModule,
     MdListIconCssMatStyler,
-    MdListCssMatStyler,
-    MdNavListCssMatStyler,
     MdDividerCssMatStyler,
     MdListSubheaderCssMatStyler,
     MdSelectionModule,
@@ -50,8 +46,6 @@ import {MdSelectionList, MdListOption} from './selection-list';
     MdNavList,
     MdListAvatarCssMatStyler,
     MdListIconCssMatStyler,
-    MdListCssMatStyler,
-    MdNavListCssMatStyler,
     MdDividerCssMatStyler,
     MdListSubheaderCssMatStyler,
     MdSelectionList,

src/lib/list/list.md

@@ -144,10 +144,9 @@ To add a divider, use `<md-divider>`.
 
 ### Accessibility
 By default, the list assumes that it will be used in a purely decorative fashion and thus sets no
-roles, ARIA attributes, or keyboard shortcuts.
-This is equivalent to having a sequence of <div> elements on the page. Any interactive content
-within the grid-list should be given an appropriate accessibility treatment based on the specific
-workflow of your application.
+roles, ARIA attributes, or keyboard shortcuts. This is equivalent to having a sequence of <div>
+elements on the page. Any interactive content within the grid-list should be given an appropriate
+accessibility treatment based on the specific workflow of your application.
 
 If the list is used to present a list of non-interactive content items, then the list element should
- be given `role="list"` and each tile should be given `role="listitem"`.
+be given `role="list"` and each tile should be given `role="listitem"`.

src/lib/list/list.ts

@@ -46,7 +46,10 @@ export class MdListDivider {}
 @Component({
   moduleId: module.id,
   selector: 'md-nav-list, mat-nav-list',
-  host: {'role': 'navigation'},
+  host: {
+    'role': 'navigation',
+    'class': 'mat-nav-list'
+  },
   template: '<ng-content></ng-content>',
   styleUrls: ['list.css'],
   inputs: ['disableRipple'],
@@ -59,33 +62,14 @@ export class MdNavList extends _MdListMixinBase implements CanDisableRipple {}
   moduleId: module.id,
   selector: 'md-list, mat-list',
   template: '<ng-content></ng-content>',
+  host: {'class': 'mat-list'},
   styleUrls: ['list.css'],
   inputs: ['disableRipple'],
   encapsulation: ViewEncapsulation.None,
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class MdList extends _MdListMixinBase implements CanDisableRipple {}
 
-/**
- * Directive whose purpose is to add the mat- CSS styling to this selector.
- * @docs-private
- */
-@Directive({
-  selector: 'md-list, mat-list',
-  host: {'class': 'mat-list'}
-})
-export class MdListCssMatStyler {}
-
-/**
- * Directive whose purpose is to add the mat- CSS styling to this selector.
- * @docs-private
- */
-@Directive({
-  selector: 'md-nav-list, mat-nav-list',
-  host: {'class': 'mat-nav-list'}
-})
-export class MdNavListCssMatStyler {}
-
 /**
  * Directive whose purpose is to add the mat- CSS styling to this selector.
  * @docs-private