简体   繁体   English

淘汰赛:分页

[英]Knockout: Table Paging

I tried paging under my Model. 我尝试在我的模型下进行分页。 I could correctly get Arrow to move depending on how many Records I posess. 我可以正确地移动箭头,具体取决于我带来的记录数。 But data is not refelcted/decreased/increased depending on Max rows to show on a Page. 但是,根据页面上显示的“最大行数”,数据不会被取消/减少/增加。

Please find below Fiddle 请在下面找到小提琴

Refrrence Example I used is Here 我使用的参考示例在这里

/*************
  Start of logic for Paging

  ******/


  self.items = ko.observableArray();
   this.all =  self.items;

 self.pageNumber = ko.observable(0);
    self.nbPerPage = 2;

    // I think this is somewhere I am missing the functionality.

    this.totalPages = ko.computed(function() {
        var div = Math.floor(self.all().length / self.nbPerPage);
        div += self.all().length % self.nbPerPage > 0 ? 1 : 0;
        return div - 1;
    });

this.paginated = ko.computed(function() {
        var first = self.pageNumber() * self.nbPerPage;
        return self.all.slice(first, first + self.nbPerPage);
    });

    this.hasPrevious = ko.computed(function() {
        return self.pageNumber() !== 0;
    });

    this.hasNext = ko.computed(function() {
        return self.pageNumber() !== self.totalPages();
    });

  this.next = function() {
        if(self.pageNumber() < self.totalPages()) {
            self.pageNumber(self.pageNumber() + 1);
        }
    }

  this.previous = function() {
        if(self.pageNumber() != 0) {
            self.pageNumber(self.pageNumber() - 1);
        }
    }  


/***********
End of Logic for Paging

*/ * /

You just need to update your view from... 您只需要从...更新视图即可。

<tbody data-bind="foreach: items " >

to

<tbody data-bind="foreach: paginated " >

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM