-2
私はページングの問題があります。データベースには21個のオブジェクトがありますので、それらを取得すると、今はページングで表示したい、すべてのものはうまくいきますが、ページングモジュールには行数それはページごとに10行を取っていない4ページangular2のページングngxブートストラップ
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}}