Ngx-datatable 与 Angular 2 禁用分页答案

【问题标题】：Ngx-datatable with Angular 2 disabling paginationNgx-datatable 与 Angular 2 禁用分页
【发布时间】：2018-02-13 12:46:12
【问题描述】：

我有一个表，其中包含使用 ngx-datatable 的结果列表。目前，表格以分页显示结果。

我想添加一个按钮来“显示所有”结果而不用分页，你认为我应该怎么做？

<ngx-datatable class="material"
[rows]="rows"
[columnMode]="'force'"
[headerHeight]="40"
[footerHeight]="40"
[rowHeight]="30"
[externalPaging]="true"
[limit]="50"
[selectionType]="'checkbox'">
<ngx-datatable-column
        [width]="30"
        [sortable]="false"
        [canAutoResize]="false"
        [draggable]="false"
        [resizeable]="false"
        [headerCheckboxable]="true"
        [checkboxable]="true">
      </ngx-datatable-column>
          <ngx-datatable-column name="Name">
            <ng-template let-value="value" ngx-datatable-cell-template>
                <div class="redNumber">{{value}}</div>
            </ng-template>
      </ngx-datatable-column>
      <ngx-datatable-column name="Title"></ngx-datatable-column>
      <ngx-datatable-column name="company"></ngx-datatable-column>
      <ngx-datatable-column name="Status" [cellClass]="getStatusClass">  
  </ngx-datatable-column>
<ngx-datatable-column name="Last connexion"></ngx-datatable-column>

【问题讨论】：

尝试从 ngx-datatable 组件中删除属性 [limit]="50"

标签： angular pagination ngx-datatable

【解决方案1】：

Ngx-Datatable 页脚将隐藏，或者如果你想显示更多按钮，你也可以通过编写块并使用 isVisible 变量来显示/隐藏更多按钮来做到这一点

<ngx-datatable-footer>
      <ng-template ngx-datatable-footer-template let-rowCount="rowCount" let-pageSize="pageSize" let-selectedCount="selectedCount"
        let-curPage="curPage" let-offset="offset" let-isVisible="isVisible">
        <div class="container" >

        </div>
      </ng-template>
    </ngx-datatable-footer>

【讨论】：

【解决方案2】：

您可以覆盖页脚模板，以便 datatable-pager won't appear 和因此分页将被禁用。

<ngx-datatable-footer *ngIf="isChild">
  <ng-template ngx-datatable-footer-template>
  this text will appear instead of datatable-pager
  </ng-template>
</ngx-datatable-footer>

【讨论】：

【解决方案3】：

应用[footerHeight]="0"，它会删除页脚。

【讨论】：