diff options
Diffstat (limited to 'src/app/components/shared/pagination/pagination.component.html')
| -rw-r--r-- | src/app/components/shared/pagination/pagination.component.html | 48 |
1 files changed, 48 insertions, 0 deletions
diff --git a/src/app/components/shared/pagination/pagination.component.html b/src/app/components/shared/pagination/pagination.component.html new file mode 100644 index 0000000..ad198fc --- /dev/null +++ b/src/app/components/shared/pagination/pagination.component.html @@ -0,0 +1,48 @@ +<!-- + ~ Copyright (c) 2022. Deutsche Telekom AG + ~ + ~ Licensed under the Apache License, Version 2.0 (the "License"); + ~ you may not use this file except in compliance with the License. + ~ You may obtain a copy of the License at + ~ + ~ http://www.apache.org/licenses/LICENSE-2.0 + ~ + ~ Unless required by applicable law or agreed to in writing, software + ~ distributed under the License is distributed on an "AS IS" BASIS, + ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + ~ See the License for the specific language governing permissions and + ~ limitations under the License. + ~ + ~ SPDX-License-Identifier: Apache-2.0 + --> + + +<div class="d-flex flex-wrap justify-content-between mt-3"> + <div> + <ngb-pagination + [collectionSize]="collectionSize" + [pageSize]="pageSize" + [page]="page" + (pageChange)="emitPageChange($event)" + ></ngb-pagination> + <span class="ml-2 small"> + {{ 'common.pagination.totalCount' | translate: { value: collectionSize } }} + </span> + </div> + <div> + <label for="item-select" class="sr-only"> + {{ 'common.select.description' | translate }} + </label> + <select + id="item-select" + class="custom-select" + style="width: auto" + [ngModel]="pageSize" + (ngModelChange)="emitModelChange($event)" + > + <option *ngFor="let n of itemsPerPage" [ngValue]="n"> + {{ 'common.select.itemsPerPage' | translate: { value: n } }} + </option> + </select> + </div> +</div> |