分頁ngx bootstrap爲angular2

-2

我有一個問題與分頁第一我有21個對象在數據庫中，所以當我得到他們我想顯示他們與分頁剛纔，所有的東西都很好，但我認爲分頁模塊有一些行默認顯示是喜歡它花了10行每頁面，而不是4每頁分頁ngx bootstrap爲angular2

export class GroupComponent implements OnInit { 


public maxSize:number = 5; 
    bigTotalItems:number = 175; 
    bigCurrentPage:number = 1; 
    numPages:number = 0; 
    itemsPerPage = 4; 
    groups : any; 
    myVar:Boolean=false; 

constructor(private groupeService:DataServiceService) { 
    parent.displayGroupeIcon(); 
    } 

    ngOnInit() { 
    this.getListGroups(); 
    } 

getListGroups(){ 

    this.groupeService.getGroupsByPageAndSize(this.bigCurrentPage-1,this.itemsPerPage).subscribe(groups => { 
    this.groups=groups; 
    this.numPages=groups.totalPages; 
    this.bigTotalItems=groups.totalElements; 
    this.myVar = true; 
      }); 

}

這個模板

<table class="table table-striped"> 
      <thead> 
      <tr> 
      <th >Identifiant </th> 
       <th >Nom </th> 
       <th >Image</th> 

       <th ></th> 
       <th ></th> 
      </tr> 
      </thead> 
      <tbody *ngIf="myVar"> 

      <tr *ngFor="let groupe of groups.content" > 
      <td >{{groupe.idGroupe}} </td> 
      <td >{{groupe.nom}} </td> 
      <td >{{groupe.imageUrl}}</td> 
    <td ><button class="btn btn-warning" >Update <i class="fa fa-cog" aria-hidden="true"></i></button></td> 
      <td ><button class="btn ink-reaction btn-danger">Delete <i class="fa fa-trash-o" aria-hidden="true"></i></button></td> 
      </tr> 



     </tbody> 
     </table> 



<div class="col-md-6"> 
    <pagination [totalItems]="bigTotalItems" [(ngModel)]="bigCurrentPage" [maxSize]="maxSize" class="pagination-sm" 
       [boundaryLinks]="true" [rotate]="false" (click)="getListGroups()"></pagination> 
</div> 
bigTotalItems : {{bigTotalItems| json}} 

numPages : {{numPages|json}}

Heeelp pleaseee和感謝的建議。

來源

2017-04-14 Elouafi

我RESOLV它我只是加入[itemsPerPage] = 「itemsPerPage」指令在我的分頁的選擇器

來源

2017-04-14 15:09:58 Elouafi

分頁ngx bootstrap爲angular2

回答

相關問題