敲除模板綁定不更新UI

Question

我有綁定到我的模型的遞歸模板。問題是，我一次修改一個對象，所以如果單擊下一個對象，並嘗試加載模板不更新的新對象。

我的模板：

<div class="portlet-body" id="details-container" data-bind="template: { name: 'packageTemplate', data: viewModel.packageElements() }"></div> 

爲MyModel：

var viewModel; 
function packageElementViewModel(data) { 
    var self = this; 
    self.packageElements = ko.observable({ Description: ko.observable(), Children:  ko.observableArray() }); 
} 

我的初始化：

$.ajax({ 
    'type': 'POST', 
    'url': 'http://www.someurl.com/', 
    'data': { PackageId: 1}, 
    'success': function (data) { 
     viewModel.packageElements = ko.observable(ko.mapping.fromJS(data)); 
     ko.applyBindings(viewModel); 
    }); 

當我選擇一個新的軟件包我把這個代碼，我更新變量，但UI不更新。：

 var id = PackageSummary.packageTable.fnGetData($(this).get(0))['Id']; 
     $.ajax({ 
      'type': 'POST', 
      'url': 'http://www.someurl.com', 
      'data': { PackageId: id }, 
      'success': function (data) { 
       viewModel.packageElements = ko.observable(ko.mapping.fromJS(data)); 
      }, 
      'error': function (XMLHttpRequest, textStatus, errorThrown) { 
       alert(XMLHttpRequest.responseText); 
      } 
     }); 

這是我的數據：

{ 
     "Description":"Top", 
     "Children":[ 
      { 
       "Description":"Second-Level 1", 
       "Children":[ 
        { 
         "Description":"Third Level 1", 
         "Children":[] 
        }, 
        { 
         "Description":"Third Level 2", 
         "Children":[] 
        },   
        { 
         "Description":"Third Level 3", 
         "Children":[] 
        } 
       ] 
      }, 
      { 
       "Description":"Second Level 2":[ 
        { 
         "Description":"Third Level 1", 
         "Children":[] 
        }, 
        { 
         "Description":"Third Level 2", 
         "Children":[] 
        }, 
        { 
         "Description":"Third Level 3", 
         "Children":[] 
        } 
       ] 
      } 
     ] 
    } 

Answer 1

我相信問題是你在Ajax調用

'success': function (data) { 
    viewModel.packageElements = ko.observable(ko.mapping.fromJS(data)); 
} 

與該元素打破了綁定復位packageElements在你成功的方法當您撥打ko.applyBindings(viewModel)

而不是您想要做的只是設置Description和對已在視圖模型

'success': function (data) { 
    viewModel.packageElements().Description(data.Description); 
    viewModel.packageElements().Children(data.Children); 
} 

的觀種性質我做出了榜樣基本上是做同樣的事情，但用不同的數據。 http://jsfiddle.net/vGuHU/

另外，作爲一個附註。從您發佈的代碼中，packageElements沒有真正的原因是ko.observable()