获取当前页面上的行总数

Question

在“角应用程序”中，我需要在分页部分显示当前页面上的行总数。但是，目前Devextreme行计数会返回总行数，而不管页面如何。

以下是我的代码:-

<dxo-paging [pageSize]="5"> </dxo-paging>
    <dxo-pager
        [visible]="true"
        [allowedPageSizes]="allowedPageSizes"
        [displayMode]="displayMode"
        [showPageSizeSelector]="showPageSizeSelector"
        [showInfo]="true"
        infoText="Displaying {0} -  {2} of {1} "
        [showNavigationButtons]="showNavButtons"
      >
      </dxo-pager>

以下截图:-

​

现在，我在网格中只有5行，但是它显示了11行，这是我从数据库接收到的总行数。请给我建议。

Answer 1

如果我理解正确，你想在第一页显示1-5，在第二页显示6-10，以此类推。您可以通过将函数绑定到[infoText]属性并自定义文本输出来实现这一点。这在官方文档中没有发现，但它有效。

HTML：

<dxo-paging [pageSize]="5"> </dxo-paging>
<dxo-pager
    [visible]="true"
    [allowedPageSizes]="allowedPageSizes"
    [displayMode]="displayMode"
    [showPageSizeSelector]="showPageSizeSelector"
    [showInfo]="true"
    [infoText]="infoText"
    [showNavigationButtons]="showNavButtons">
</dxo-pager>

JS/TS：

infoText(currentPageNumber, totalPageCount, totalRowCount) {
    const myPageSize = 5; // use global variable instead and bind it to dxo-paging
    const from = +currentPageNumber * myPageSize - (myPageSize - 1);
    const to = +currentPageNumber * myPageSize;
    return `Displaying ${from}-${to}`;
}