3

Knockout.js を使用してデータを入力する際に​​問題があります。データ (9 つの MainMenuModel を持つ HomeViewModel) が Web API から正常に取得されます。ul タグの下に 9 li タグが必要です。しかし、HTML 出力は空です。がんばったが解決できない。助けていただければ幸いです。

Web 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出力

<ul id="mainMenus" data-bind="foreach: menus"></ul>
4

1 に答える 1

2

ko.observableとko.observableArrayは関数です。それらに新しい値を割り当てるには、新しい値を引数としてそれらを呼び出す必要があります。

ドキュメントも参照してください:オブザーバブルの読み取りと書き込み。

コードを次のように変更します$.getJSON。

$.getJSON(baseUri, function (data) {
    self.menus(data.MainMenus);
});
于 2013-09-23T08:09:53.570 に答える