ng2智能表的分页问题

Question

我在Angular 2应用程序中使用ng2智能表，其中的分页有问题。我正在加载一个数据对象数组，它正确地显示了前五个（我总共有20个），但表底部的分页显示

private tableSettings = {
    columns: {
        id: {
          title: 'ID',
          filter: false
        },
        name: {
          title: 'Name',
          filter: false
        },
    },
    hideSubHeader: true,
    attr: {
        class: 'id-field'
    },
    actions:{
        edit: false
    },
    delete:{
        confirmDelete: true
    },
    pager : {
        display : true,
        perPage:5
    }
}

你知道为什么会这样吗

Answer 1

您应该在传递到源的配置对象中传递总计密钥，如下所示：

this.source = new ServerDataSource(_http, 
{
dataKey: 'data.data',
endPoint: 'https://myapi/endpoint',
pagerPageKey: 'page', // this should be page number param name in endpoint (request not response) for example 'page'
pagerLimitKey: 'pageSize', // this should page size param name in endpoint (request not response)
totalKey: 'data.meta.total', // this is total records count in response, this will handle pager
});

Answer 2

我遇到过一个类似的问题，分页根本没有显示@Babak几乎是对的，您需要使用Total rows的值将X-Total-Count添加到响应头中，但是您还需要通过向头中添加访问控制expose headers:X-Total-Count来公开该头。

e、 g.对于C#WebApi：

var response = new HttpResponseMessage();
response.Headers.Add("access-control-expose-headers", "X-Total-Count");
response.Headers.Add("X-Total-Count", "100");

希望这对别人有帮助。

Answer 3

您没有提到您使用的是服务器数据源还是本地数据源。假设您使用的是服务器数据源，我猜您没有通过

X-Total-Count: 20

在您的响应头中，以便客户端知道您总共有多少条记录。

希望能有帮助。