こんにちは、ノックアウトで Web API を使用して単純な Web を開発しています。Json 構造からデータのリストを表示したかったのです。
function OrganisationViewModel() {
var self = this;
self.Organisations = ko.observableArray();
var baseUri = '@ViewBag.ApiUrl';
$.getJSON(baseUri, self.Organisations);
}
$(document).ready(function () {
ko.applyBindings(new OrganisationViewModel());
})
上記のコードは JSON を取得し、それを Observable 配列に設定します。
<div>
<ul id="update-Org" data-bind="foreach: Organisations">
<li>
<div>
<span data-bind:"text: $data.Name"></span>
</div>
<div>
<span data-bind:"value: $data.PhoneNumber"></span>
</div>
</li>
</ul>
</div>
上記は JSON データを出力するための HTML です。出力は 4 つのドットのみを返します。これは、配列に 4 つの項目があることを認識していることを意味します。次のJSONデータを取得するため、空のJSONデータに関するものではないと確信しています。
0: {$id:1, Contacts:[{$id:2, Organisation:{$ref:1}, Id:1, ContactName:bg1, OrganisationId:1},…],…}
$id: "1"
Contacts: [{$id:2, Organisation:{$ref:1}, Id:1, ContactName:bg1, OrganisationId:1},…]
0: {$id:2, Organisation:{$ref:1}, Id:1, ContactName:bg1, OrganisationId:1}
1: {$id:3, Organisation:{$ref:1}, Id:2, ContactName:bg2, OrganisationId:1}
2: {$id:4, Organisation:{$ref:1}, Id:3, ContactName:bg3, OrganisationId:1}
Devices: []
Id: 1
Licenses: []
Name: "Aug1"
PhoneNumber: "021"
1: {$id:5, Contacts:[], Licenses:[], Devices:[], Id:2, Name:Aug2, PhoneNumber:02111}
$id: "5"
Contacts: []
Devices: []
Id: 2
Licenses: []
Name: "Aug2"
PhoneNumber: "02111"
2: {$id:6, Contacts:[], Licenses:[], Devices:[], Id:3, Name:Aug3, PhoneNumber:0211333}
$id: "6"
Contacts: []
Devices: []
Id: 3
Licenses: []
Name: "Aug3"
PhoneNumber: "0211333"
.....