fix(paginator): page size selector not working (#7263)

angular · Oct 3, 2017 · 2b3d795 · 2b3d795
1 parent 38268d3
commit 2b3d795
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 12 deletions.
diff --git a/src/lib/paginator/paginator.html b/src/lib/paginator/paginator.html
@@ -3,11 +3,13 @@
     {{_intl.itemsPerPageLabel}}
   </div>
 
-  <mat-form-field *ngIf="_displayedPageSizeOptions.length > 1">
-    <mat-select class="mat-paginator-page-size-select"
-               [value]="pageSize"
-               [aria-label]="_intl.itemsPerPageLabel"
-               (change)="_changePageSize($event.value)">
+  <mat-form-field
+    *ngIf="_displayedPageSizeOptions.length > 1"
+    class="mat-paginator-page-size-select">
+    <mat-select
+      [value]="pageSize"
+      [aria-label]="_intl.itemsPerPageLabel"
+      (change)="_changePageSize($event.value)">
       <mat-option *ngFor="let pageSizeOption of _displayedPageSizeOptions" [value]="pageSizeOption">
         {{pageSizeOption}}
       </mat-option>

diff --git a/src/lib/paginator/paginator.scss b/src/lib/paginator/paginator.scss
@@ -32,13 +32,8 @@ $mat-paginator-button-increment-icon-margin: 16px;
 }
 
 .mat-paginator-page-size-select {
-  // Since the select won't have a placeholder we can remove the space that is reserved for it.
-  padding-top: 0;
   margin: $mat-paginator-selector-margin;
-
-  .mat-select-trigger {
-    min-width: $mat-paginator-selector-trigger-min-width;
-  }
+  width: $mat-paginator-selector-trigger-min-width;
 }
 
 .mat-paginator-range-label {

diff --git a/src/lib/select/select-module.ts b/src/lib/select/select-module.ts
@@ -11,6 +11,7 @@ import {CommonModule} from '@angular/common';
 import {MatSelect, MatSelectTrigger, MAT_SELECT_SCROLL_STRATEGY_PROVIDER} from './select';
 import {MatCommonModule, MatOptionModule} from '@angular/material/core';
 import {OverlayModule} from '@angular/cdk/overlay';
+import {MatFormFieldModule} from '@angular/material/form-field';
 
 
 @NgModule({
@@ -20,7 +21,7 @@ import {OverlayModule} from '@angular/cdk/overlay';
     MatOptionModule,
     MatCommonModule,
   ],
-  exports: [MatSelect, MatSelectTrigger, MatOptionModule, MatCommonModule],
+  exports: [MatFormFieldModule, MatSelect, MatSelectTrigger, MatOptionModule, MatCommonModule],
   declarations: [MatSelect, MatSelectTrigger],
   providers: [MAT_SELECT_SCROLL_STRATEGY_PROVIDER]
 })