Quantcast
Channel: Active questions tagged react-native+typescript - Stack Overflow
Viewing all articles
Browse latest Browse all 6287

How to gotTo specific page using ngx-bootstrap pagination

$
0
0

I have a query where I need to implement: How to gotTo a specific page usingngx- bootstrap pagination by entering the page number to some input field.

Here is the following code snippet :

***Template:***<div class="row"><div class="col-xs-12 col-12"><div class="content-wrapper"><p class="content-item" *ngFor="let content of returnedArray">{{content}}</p></div><pagination [totalItems]="contentArray.length" (pageChanged)="pageChanged($event)"></pagination></div></div>**.ts file**import { Component, OnInit } from '@angular/core';import { PageChangedEvent } from 'ngx-bootstrap/pagination';@Component({    // eslint-disable-next-line @angular-eslint/component-selector    selector: 'demo-pagination-content-switching',    templateUrl: './content-switching.html',    styles: [`.content-wrapper {border: 1px solid #ddd;border-radius: 4px;padding-left: 10px;margin-bottom: 10px;}`]})export class DemoPaginationContentSwitchingComponent implements OnInit {    contentArray = new Array(90).fill('');    returnedArray?: string[];    ngOnInit(): void {        this.contentArray = this.contentArray.map((v: string, i: number) => `Content line ${i + 1}`);        this.returnedArray = this.contentArray.slice(0, 10);    }    pageChanged(event: PageChangedEvent): void {        const startItem = (event.page - 1) * event.itemsPerPage;        const endItem = event.page * event.itemsPerPage;        this.returnedArray = this.contentArray.slice(startItem, endItem);    }}

Any help is appreciated!!

Thanks in advance


Viewing all articles
Browse latest Browse all 6287

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>