智能表分页链接不工作

Smart Table Pagination links not working

本文关键字:工作 链接 分页 智能      更新时间:2023-09-26

我有下面的HTML:

<table st-table="displayedCollection" 
       st-safe-src="rowCollection" 
       class="table table-striped" 
       st-pipe="callServer">
    <thead>
        <tr>
            <th st-sort="id">id</th>
            <th st-sort="name">name</th>
        </tr>
    </thead>
    <tbody ng-show="!isLoading">
        <tr ng-repeat="row in displayedCollection">
            <td>{{row.id}}</td>
            <td>{{row.name}}</td>
        </tr>
    </tbody>
    <tbody ng-show="isLoading">
        <tr>
            <td colspan="2" class="text-center">Loading ... </td>
        </tr>
    </tbody>
    <tfoot>
        <tr>
            <td class="text-center" colspan="2">
                <div 
                    st-template="templates/plugins/pagination.html" 
                    st-pagination="" 
                    st-items-by-page="10" 
                    class="ng-isolate-scope">
                </div>
            </td>
        </tr>
    </tfoot>
</table>

我在控制器中有以下代码:

$scope.callServer = function callServer(tableState) {
        var pagination = tableState.pagination;
        var start = pagination.start || 0;
        var size = pagination.number || 10;
        console.log('tableState:', tableState);
        $scope.isLoading = true;
        TestSuiteService.getPage(start, size, tableState).then(function (response) {
            $scope.rowCollection = response.results;
            $scope.displayedCollection = [].concat($scope.rowCollection);
            tableState.pagination.numberOfPages = response.numberOfPages;
            $scope.isLoading = false;
        });
    };

我有以下st-template

<div class="pagination" ng-if="pages.length >= 2">
    <ul class="pagination">
        <li ng-if="currentPage > 1">
            <a ng-click="selectPage(1)">&lt;&lt;</a>
        </li>
        <li ng-if="currentPage > 1">
            <a ng-click="selectPage(currentPage-1)">&lt;</a>
        </li>
        <li ng-repeat="page in pages" ng-class="{active: page==currentPage}">
            <a ng-click="selectPage(page)">{{page}}</a>
        </li>
        <li ng-if="currentPage < numPages">
            <a ng-click="selectPage(currentPage+1)">&gt;</a>
        </li>
        <li ng-if="currentPage < numPages">
            <a ng-click="selectPage(numPages)">&gt;&gt;</a>
        </li>
    </ul>
</div>

当我点击页面时,它会从服务器获取数据并将其显示在表中,但页面并没有被选中。由于此原因,上一页和最后一页的链接也不会显示。页面1始终保持活动状态。

我已经从table中删除了st-safe-src属性,所以在我的情况下,我必须删除st-safe-src="rowCollection"才能使其工作。