與淘汰賽JS

Question

我有以下的HTML在淘汰賽

<div data-bind="with: talkData"> 
    <div data-bind="foreach: Talks"> 
     <p data-bind="text: Title"></p> 
    </div> 
</div> 

<p> 
    <button class="btn btn-success previous" 
      data-bind="click: $root.PageBack, disable: $root.page() == 1">Prev</button>       
    <button class="btn btn-success next" 
      data-bind="click: $root.PageNext, disable: $root.page() == $root.talkData().TotalPageCount">Next</button> 
</p> 

以下模型結合分頁問題：

$(function() { 
    function TalksViewModel() { 
     var self = this; 
     self.page = ko.observable(1); 
     self.records = ko.observable(1); 
     self.totalPages = ko.observable(1); 
     self.talkData = ko.observable(); 

     self.IsPrevEnabled = isPrevEnabled; 

     function pageBack(item) { 
      self.page(self.page() - 1); 
      loadDataFromServer(); 
     } 

     self.PageBack = pageBack; 

     function pageNext(item) { 
      console.log("page next"); 
      self.page(self.page() + 1); 
      loadDataFromServer(); 
     } 

     self.PageNext = pageNext; 

     function loadDataFromServer() { 
      var url = '/Talks/GetPagedTalks'; 
      self.talkData(null); 
      $.get(url, { page: self.page() }, self.talkData); 
     } 

     // Initial page 
     loadDataFromServer();   
    } 

    ko.applyBindings(new TalksViewModel()); 
}); 

的JSON從 'GetPagedTalks' 調用返回的是：

Talks: [{Title:Philippians 1:12-26,…}, {Title:Philippians 1:1-11,…}, {Title:Devoted Lives: ,…}] 
0: {Title:Philippians 1:12-26,…} 
1: {Title:Philippians 1:1-11,…} 
2: {Title:Devoted Lives: ,…} 
TotalPageCount: 59 
TotalRowCount: 177 

下一個和上一個按鈕的工作，但我真的很努力知道如何設置總頁數fr om從GET調用返回的數據。

行： 禁用：$ root.page（）== $ root.talkData（）TotalPageCount

是不工作的。我認爲TotalPageCount將是talkData的一部分。

任何幫助表示讚賞。

謝謝。

Answer 1

若要設置數據（值和頁數）試試這個：

$.get(url, { page: self.page() }) 
.done(function(data){ 
    self.talkData(data); 
    self.totalPages(data.TotalPageCount); 
    self.records(data.TotalRowCount); 
}) 
.fail(function(xhr,status,error){ 
    // handle any error here 
}); 

在這種特殊情況下 - 我用GET承諾「完成」獲取數據。檢查jquery docs - 他們有一些額外的樣本可用於使用/使用返回參數的方式。

Answer 2

這篇文章很舊，但如果有人遇到同樣的問題，可以用一種非常簡單的方法實現分頁，而不用擔心其內部。 （這裏是http://contractnamespace.blogspot.com/2014/02/pagination-with-knockout-jquery.html）。

基本上，我使用了正常的敲除數據綁定與AJAX和數據已從服務器中檢索後，我打電話插件。你可以在這裏找到插件。 its called Simple Pagination。