Question

目前，我可以成功显示分页控制器，但是我遇到的情况是，当我单击下一页时，uigrid表不会立即更改内容，而是仅将鼠标悬停在该表上才更改。（pagination.js的信息位于http://pagination.js.org上） HTML：

<div id="pagination-container" ></div>

JS（控制器）

function init() {
initGrid();
.........
initPagination($scope.gridOptions.data,5,2);
.........
}

var initPagination = function(data, pageSizeOfGrid, pageRangeOfGrid) {
    var container = $('#pagination-container');
        container.pagination({
            dataSource: data,
            pageSize: pageSizeOfGrid,
            pageRange: pageRangeOfGrid,
            showGoInput: true,
            showGoButton: true,
            /** overwrite methods/events of buttons **/
            afterPreviousOnClick: function() {
                console.log('previous page!');
                $scope.gridApi.pagination.previousPage();
            },
            afterNextOnClick: function() {
                console.log('next page!');
                $scope.gridApi.pagination.nextPage();
            },
            afterPageOnClick: function() {
                console.log('selected page: ', 
                container.pagination('getSelectedPageNum') );
                //$scope.gridApi.pagination.seek();
            }

        })
    };

Answer 1

我找到了解决方案，只需添加代码即可刷新ui网格表

afterPreviousOnClick: function() {
            console.log('previous page!');
            $scope.gridApi.pagination.previousPage();
            $scope.gridApi.core.refresh(); // ro refresh the table
        },

如何使用ui-grid应用pagination.js

1 个答案: