Javascript 如何使用Angular获取ngx分页中的最后页码

我们如何在ngx分页中使用自定义模板，并在单击时使用第一个和最后一个按钮，我已经使用分页模板实现了相同的功能

如何动态查找最后一页的页码

<ul class="meal-list">
  <li *ngFor="let meal of meals | paginate: config">
    {{ meal.id }}
    {{ meal.name }}
  </li>
</ul>

<pagination-template
  #p="paginationApi"
  [id]="config.id"
  (pageChange)="config.currentPage = $event"
>
  <div class="custom-pagination">
    <div class="pagination-first" [class.fade]="p.isFirstPage()">
      <a *ngIf="!p.isFirstPage()" (click)="p.setCurrent(1)">First</a>
    </div>
    <div class="pagination-previous" [class.disabled]="p.isFirstPage()">
      <a *ngIf="!p.isFirstPage()" (click)="p.previous()"> < </a>
    </div>

    <div
      *ngFor="let page of p.pages"
      [class.current]="p.getCurrent() === page.value"
    >
      <a
        (click)="p.setCurrent(page.value)"
        *ngIf="p.getCurrent() !== page.value"
      >
        <span>{{ page.label }}</span>
      </a>
      <div *ngIf="p.getCurrent() === page.value">
        <span>{{ page.label }}</span>
      </div>
    </div>

    <div class="pagination-next" [class.disabled]="p.isLastPage()">
      <a *ngIf="!p.isLastPage()" (click)="p.next()"> > </a>
    </div>
    <div class="pagination-last" [class.disabled]="p.isLastPage()">
      <a *ngIf="!p.isLastPage()" (click)="p.setCurrent(4)">Last</a>
    </div>
  </div>
</pagination-template>

{{mean.id}
{{meat.name}


弗斯特
< 
{{page.label}}
{{page.label}}
> 
最后

您可以同时使用

setCurrent

和

getLastPage

来实现这一点

范例

<div class="pagination-last" [class.disabled]="p.isLastPage()">
  <a *ngIf="!p.isLastPage()" (click)="p.setCurrent(p.getLastPage())">Last</a>
</div>

最后

您可以同时使用

setCurrent

和

getLastPage

来实现这一点

范例

<div class="pagination-last" [class.disabled]="p.isLastPage()">
  <a *ngIf="!p.isLastPage()" (click)="p.setCurrent(p.getLastPage())">Last</a>
</div>

最后