TSK-1487: fix bug in pagination input field (#1370)

* TSK-1487: fix pagination input field

* TSK-1487: fix prettier error
This commit is contained in:
Franzi321 2020-12-17 11:54:30 +01:00 committed by GitHub
parent 814fa4edae
commit 4048b16f01
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 7 additions and 8 deletions

View File

@ -1,18 +1,17 @@
<div class="pagination" #pagination>
<mat-paginator class="pagination__mat-paginator" [length]="page?.totalElements" [pageIndex]="pageSelected - 1 "
hidePageSize="true" [pageSize]="page?.size" (page)="changeToPage($event)" [showFirstLastButtons]="true"
[ngClass]="
hidePageSize="true" [pageSize]="page?.size" (page)="changeToPage($event)" [showFirstLastButtons]="true" [ngClass]="
{'pagination__mat-paginator--expanded': expanded,
'pagination__mat-paginator--collapsed': !expanded }"></mat-paginator>
<div class="pagination__go-to" *ngIf="expanded">
<div class="pagination__go-to-label">Page:</div>
<mat-form-field>
<input #inputTypeAhead matInput type="text" [matAutocomplete]="auto" [(ngModel)]="value" name="accessId"
(ngModelChange)="filter(value)"/>
<input #inputTypeAhead matInput type="text" [matAutocomplete]="auto" [(ngModel)]="pageSelected" name="accessId"
(ngModelChange)="filter(pageSelected)" (focus)="filter(pageSelected)" />
<mat-autocomplete #autoComplete autoActiveFirstOption (optionSelected)="goToPage($event.option.value)"
#auto="matAutocomplete">
#auto="matAutocomplete">
<mat-option *ngFor="let pageNumber of filteredPages" [value]="pageNumber">{{ pageNumber }}</mat-option>
</mat-autocomplete>
</mat-form-field>
</div>
</div>
</div>

View File

@ -42,12 +42,11 @@ export class PaginationComponent implements OnInit, OnChanges {
pageSelected = 1;
pageNumbers: number[];
filteredPages: string[] = [];
value: number;
ngOnInit() {
this.changeLabel();
this.value = 1;
}
ngOnChanges(changes: SimpleChanges): void {
const rangeLabel = this.paginationWrapper?.nativeElement?.querySelector('.mat-paginator-range-label');
const container = this.paginationWrapper?.nativeElement?.querySelector('.mat-paginator-container');
@ -85,6 +84,7 @@ export class PaginationComponent implements OnInit, OnChanges {
return `${start} - ${end} of ${length}`;
}
};
this.pageSelected = 1;
}
changeToPage(event) {