Footable V3：动态页面大小

Question

我正在使用具有分页功能的Footable V3（版本3.0.1），并希望为我的用户提供动态修改每页项目的能力。

我已经尝试了两种方法来实现这一目标，但两种方法都没有效果：

1）我在填充表格后尝试在代码中传递新的页面大小。

$('#availableResults').footable(
    {
        "paging": 
            "size": count
        }
    });

这导致表格立即变得格式不正确，并且控制台中出现以下错误：

FooTable: unhandled error thrown during initialization. Error: No columns supplied.(…)(anonymous function) @ footable.js:1705

2）接下来，我尝试在填充表格后动态更改表格属性的值。

angular.element( '#availableResults').attr( 'data-paging-size', count );

这没有效果。

我知道在footable V2中可以更改页面大小属性，然后触发表重绘以完成每页更改的动态项目。我知道V3是一个完全重写但可能有一个类似的V3机制，我不知道。我通读了下面的所有V3文档而没有运气。

http://fooplugins.github.io/FooTable/docs/components/paging.html

http://fooplugins.github.io/FooTable/docs/jsdocs/index.html

感谢任何帮助。

Answer 1

$('.table').footable({ 
  paging: {
    size: 5
  }
});

Answer 2

您需要重新初始化表并传入列，并在对象参数中对行进行排序。

FooTable.init('#availableResults', {
    paging: {size: 5}, columns: columns, rows: rows
});

行和列位于父作用域中并填充表所需的数据