ngb-pagination shows as first page, cannot set the page number, programmatically

Question

I am using ngb pagination

following is the code:

      <ngb-pagination class='float-right' [maxSize]=10
                                                        (pageChange)="currentPage=$event;paginationNavigation('pagination');"
                                                        [collectionSize]="totalobjects" [(pageSize)]="pageSize"
                                                        [(page)]="currentPage" aria-label="Default pagination">
      </ngb-pagination>

I am getting currentPage value from query params:

const params  = this._route.snapshot.queryParams
this.currentPage=parseInt(params['currentPage']) || 1; 

But this doesn't set the pagination html value when refreshing/loading the page,it shows as first page.

Answer 1

if you don't change the page not work put in ngOnInit const params = this._route.snapshot.queryParams because the ngOnInit it's not execute again else you refresh the navigator or when change the page (I want to say that you are in /default and go to /product-list/2, but ngOnInit it's not execute again if you're in product-list/1 and go to product-list/2)

You need subscribe to ActivatedRoute.queryParams

constructor(private activatedRoute: ActivatedRoute) {}
ngOnInit() {
  this.activatedRoute.queryParams.subscribe(params => {
    this.currentPage = (+params['currentPage']) || 1;
  });
}

NOTE: be sure you are defined your route as path: 'product-list/:currentPage'