2013-12-23 26 views
0

我是新的基因敲除JS和Pager.JS我試圖綁定Ajax請求上的數據。但它不起作用。淘汰與Pager.js數據不綁定

define(['knockout', 'pager'], function (ko, pager) { 
var viewModel = { 
    preview: function(page) { 
     pager.navigate('#Preview'); 
    } 
}; 

$.getJSON(contentUrl + 'api/Data/UserData', function (data) { 
    var jsonData = JSON.parse(data); 
    formViewModel = ko.mapping.fromJS(jsonData, {}, viewModel); 
    ko.applyBindings(formViewModel); 
}); 

pager.extendWithPage(viewModel); 
ko.applyBindings(viewModel); 
pager.start(); 
}); 


<div data-bind="page: {id: 'start', title: 'User Details'}" class="off"> 
<form id="userDetails" name="userDetails" method="post"> 

    <div class="details"> 
     <div class="columns clearfix"> 
      <div class="row"> 
       <div class="label">User Name</div> 
       <span data-bind="text: Name" class="txt"></span> 
      </div> 
      <div class="row"> 
       <div for="Address" class="label">User Address</div> 
       <span data-bind="text: Address" class="txt"></span> 
      </div> 

     </div> 
    </div> 
    <div class="nav-buttons hide-for-print"> 
     <a href="#Preview" data-bind="click: preview" class="btn" id="preview">Preview</a> 
    </div> 

</form> 
</div> 

<div data-bind="page: {id: 'Preview', title: 'User Details| Preview'}" class="off"> 
Preview page 

</div> 

<div data-bind="page: {id: '?'}" class="off"> 
<h2>Error</h2> 
<p>The page you requested does not exist.</p> 
<p><a data-bind="page-href: '../'" id="">Go back</a></p> 
</div> 

我不明白我在想什麼。如果我沒有發出ajax請求並綁定硬編碼數據,則綁定起作用。

感謝

回答

0

在猜測,我認爲它與調用ko.applyBindings做了兩次,我也並不認爲fromJS當你正在做的更新返回任何東西。同樣,我不認爲在更新模式下調用該方法會在您的視圖模型上創建可觀察對象,儘管我可能在那裏出錯了,但在進行更新映射之前,我總是執行「創建」映射。

我也會那樣做更多這樣的:

var viewModel = {}; 

$.getJSON(contentUrl + 'api/Data/UserData', function (data) { 
    var jsonData = JSON.parse(data); 
    viewModel = ko.mapping.fromJS(jsonData, {}); 
    viewModel.preview = function(page){ 
     pager.navigate('#Preview'); 
    }; 
}); 

pager.extendWithPage(viewModel); 
ko.applyBindings(viewModel); 
pager.start();