accessibility

Author: andrewseguin

src/lib/paginator/paginator.html

@@ -1,6 +1,8 @@
 <div class="mat-paginator-page-length-select">
   {{_intl.itemsPerPageLabel}}
-  <md-select [ngModel]="pageLength" (change)="_changePageLength($event.value)">
+  <md-select [ngModel]="pageLength"
+             [attr.aria-label]="_intl.itemsPerPageLabel"
+             (change)="_changePageLength($event.value)">
     <md-option *ngFor="let pageLengthOption of pageLengthOptions" [value]="pageLengthOption">
       {{pageLengthOption}}
     </md-option>
@@ -14,6 +16,7 @@
 <button md-icon-button
         class="mat-paginator-increment-button"
         (click)="incrementPage(-1)"
+        [attr.aria-label]="_intl.decrementLabel"
         [mdTooltip]="_intl.decrementLabel"
         [mdTooltipPosition]="'above'"
         [disabled]="!_canIncrementPage(-1)">
@@ -22,6 +25,7 @@
 <button md-icon-button
         class="mat-paginator-increment-button"
         (click)="incrementPage(1)"
+        [attr.aria-label]="_intl.incrementLabel"
         [mdTooltip]="_intl.incrementLabel"
         [mdTooltipPosition]="'above'"
         [disabled]="!_canIncrementPage(1)">

src/lib/paginator/paginator.ts

@@ -7,6 +7,7 @@ import {
   ViewEncapsulation
 } from '@angular/core';
 import {MdPaginatorIntl} from './paginator-intl';
+import {MATERIAL_COMPATIBILITY_MODE} from '../core';
 
 /**
  * Change event object that is emitted when the user selects a
@@ -26,6 +27,9 @@ export class PageChangeEvent {
   host: {
     'class': 'mat-paginator',
   },
+  providers: [
+    {provide: MATERIAL_COMPATIBILITY_MODE, useValue: false}
+  ],
   changeDetection: ChangeDetectionStrategy.OnPush,
   encapsulation: ViewEncapsulation.None,
 })