Knockout.js複雜對象綁定結果空HTML輸出

Question

我在使用Knockout.js填充數據時遇到問題。 數據（具有9 MainMenuModel的HomeViewModel）從Web API成功檢索。 我期望在ul標籤下有9個li標籤。但HTML輸出是空的。努力嘗試但無法解決。 我感謝任何幫助，謝謝。

數據模型收購了網絡API

public class HomeViewModel 
{ 
    public List<MainMenuModel> MainMenus { get; set; } 
} 
public class MainMenuModel 
{ 
    public string Name { get; set; } 
    public string Url { get; set; } 
} 

淘汰賽腳本

function MenusViewModel() { 
    var self = this; 
    self.menus = ko.observableArray([]); 
    var baseUri = '/api/Home'; 
    $.getJSON(baseUri, function (data) { 
     self.menus = data.MainMenus; 
    }); 
} 

$(document).ready(function() { 
    ko.applyBindings(new MenusViewModel(), document.getElementById('mainMenus')); 
}); 

_MainMenu.cshtml（部分圖）

<ul id="mainMenus" data-bind="foreach: menus"> 
    <li> 
     <a data-bind="attr: { href: $data.Url, title: $data.Name }, text: $data.Name"></a> 
    </li> 
</ul> 

HTML輸出

​​

Answer 1

ko.observable和ko.observableArray是函數。要爲它們分配一個新值，您需要用新值作爲參數來調用它們。

又見文檔：Reading and writing observables.

在$.getJSON因此改變你的代碼：

$.getJSON(baseUri, function (data) { 
    self.menus(data.MainMenus); 
});