Skip to content

Commit 2b3d795

Browse files
crisbetokara
authored andcommitted
fix(paginator): page size selector not working (#7263)
1 parent 38268d3 commit 2b3d795

File tree

3 files changed

+10
-12
lines changed

3 files changed

+10
-12
lines changed

src/lib/paginator/paginator.html

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -3,11 +3,13 @@
33
{{_intl.itemsPerPageLabel}}
44
</div>
55

6-
<mat-form-field *ngIf="_displayedPageSizeOptions.length > 1">
7-
<mat-select class="mat-paginator-page-size-select"
8-
[value]="pageSize"
9-
[aria-label]="_intl.itemsPerPageLabel"
10-
(change)="_changePageSize($event.value)">
6+
<mat-form-field
7+
*ngIf="_displayedPageSizeOptions.length > 1"
8+
class="mat-paginator-page-size-select">
9+
<mat-select
10+
[value]="pageSize"
11+
[aria-label]="_intl.itemsPerPageLabel"
12+
(change)="_changePageSize($event.value)">
1113
<mat-option *ngFor="let pageSizeOption of _displayedPageSizeOptions" [value]="pageSizeOption">
1214
{{pageSizeOption}}
1315
</mat-option>

src/lib/paginator/paginator.scss

Lines changed: 1 addition & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -32,13 +32,8 @@ $mat-paginator-button-increment-icon-margin: 16px;
3232
}
3333

3434
.mat-paginator-page-size-select {
35-
// Since the select won't have a placeholder we can remove the space that is reserved for it.
36-
padding-top: 0;
3735
margin: $mat-paginator-selector-margin;
38-
39-
.mat-select-trigger {
40-
min-width: $mat-paginator-selector-trigger-min-width;
41-
}
36+
width: $mat-paginator-selector-trigger-min-width;
4237
}
4338

4439
.mat-paginator-range-label {

src/lib/select/select-module.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ import {CommonModule} from '@angular/common';
1111
import {MatSelect, MatSelectTrigger, MAT_SELECT_SCROLL_STRATEGY_PROVIDER} from './select';
1212
import {MatCommonModule, MatOptionModule} from '@angular/material/core';
1313
import {OverlayModule} from '@angular/cdk/overlay';
14+
import {MatFormFieldModule} from '@angular/material/form-field';
1415

1516

1617
@NgModule({
@@ -20,7 +21,7 @@ import {OverlayModule} from '@angular/cdk/overlay';
2021
MatOptionModule,
2122
MatCommonModule,
2223
],
23-
exports: [MatSelect, MatSelectTrigger, MatOptionModule, MatCommonModule],
24+
exports: [MatFormFieldModule, MatSelect, MatSelectTrigger, MatOptionModule, MatCommonModule],
2425
declarations: [MatSelect, MatSelectTrigger],
2526
providers: [MAT_SELECT_SCROLL_STRATEGY_PROVIDER]
2627
})

0 commit comments

Comments
 (0)