嵌套JSON数组和Knockout observableArray
[英]Nested JSON arrays and Knockout observableArray
问题描述
I need bind this JSON array to my ViewModel. 
我需要将此JSON数组绑定到我的ViewModel。 There is no errors, just data did not binded. 没有错误，只是数据没有绑定。
[
[
{
"FlightID": "565",
"FlightNumber": "731",
"CityFromID": "1",
"CityFromCode": "MOW",
"CityToID": "19",
"CityToCode": "BCN",
"AirportFromCode": "DME",
"AirportFromName": null,
"AirportToCode": "BCN",
"AirportToName": null,
"DepartureDate": "20150320",
"DepartureTime": "17:00",
"ArrivalDate": "20150320",
"ArrivalTime": "21:00",
"Price": "350",
"Currency": "€",
"AirServiceID": "89",
"AirCraft": "Boeing",
"AirlineName": "TRANSAERO",
"AirlineCode": "UN",
"PackageID": "232",
"CityFromName": "Москва",
"CityToName": "Барселона",
"TariffName": null,
"FinalPrice": 700
},
{
"FlightID": "566",
"FlightNumber": "732",
"CityFromID": "19",
"CityFromCode": null,
"CityToID": "1",
"CityToCode": null,
"AirportFromCode": "BCN",
"AirportFromName": null,
"AirportToCode": "DME",
"AirportToName": null,
"DepartureDate": "20150321",
"DepartureTime": "07:00",
"ArrivalDate": "20150321",
"ArrivalTime": "11:00",
"Price": "350",
"Currency": "€",
"AirServiceID": "89",
"AirCraft": "Boeing",
"AirlineName": "TRANSAERO",
"AirlineCode": "UN",
"PackageID": "232",
"CityFromName": "Барселона",
"CityToName": "Москва",
"TariffName": null,
"FinalPrice": 700
}
],
[
{
"FlightID": "563",
"FlightNumber": "2639",
"CityFromID": "1",
"CityFromCode": "MOW",
"CityToID": "19",
"CityToCode": "BCN",
"AirportFromCode": "SVO",
"AirportFromName": null,
"AirportToCode": "BCN",
"AirportToName": null,
"DepartureDate": "20150320",
"DepartureTime": "11:50",
"ArrivalDate": "20150320",
"ArrivalTime": "19:15",
"Price": "350",
"Currency": "€",
"AirServiceID": "89",
"AirCraft": "Boeing",
"AirlineName": "Aeroflot-Russian International AirLines",
"AirlineCode": "SU",
"PackageID": "232",
"CityFromName": "Москва",
"CityToName": "Барселона",
"TariffName": null,
"FinalPrice": 700
},
{
"FlightID": "564",
"FlightNumber": "2640",
"CityFromID": "19",
"CityFromCode": null,
"CityToID": "1",
"CityToCode": null,
"AirportFromCode": "BCN",
"AirportFromName": null,
"AirportToCode": "SVO",
"AirportToName": null,
"DepartureDate": "20150321",
"DepartureTime": "11:50",
"ArrivalDate": "20150321",
"ArrivalTime": "14:50",
"Price": "350",
"Currency": "€",
"AirServiceID": "89",
"AirCraft": "Boeing",
"AirlineName": "Aeroflot-Russian International AirLines",
"AirlineCode": "SU",
"PackageID": "232",
"CityFromName": "Барселона",
"CityToName": "Москва",
"TariffName": null,
"FinalPrice": 700
}
]
]
This is how I call: 这就是我所说的：
self.getprices = function () {
$.ajax({
url: "@Url.Content("~/Home/GetFlights")",
data: $("form").serialize(),
type: "post",
cache: false,
dataType: "json"
})
.done(function (result) {
if (result === "Запрос не вернул результатов.") {
$("#errlbl").hide();
$("#errormsg").text(result);
$("#modalerror").modal();
} else {
self.prices(ko.toJSON(result));
ko.mapping.fromJS(result, {}, self.prices());
}
})
.fail(function (xhr, ajaxOptions, thrownError) {
console.log(xhr.responseText);
});
};
And this is markup: 这是标记：
<div class="row" id="searchresult">
<div class="col-md-6" id="flightsfrom">
<table class="table table-striped">
<tbody data-bind="foreach: flightsfrom">
<tr>
<td data-bind="text: ko.utils.unwrapObservable($data.CityFromName) + ' ' + ko.utils.unwrapObservable($data.AirportFromCode) + ' - ' + ko.utils.unwrapObservable($data.CityToName) + ' ' + ko.utils.unwrapObservable($data.AirportToCode)"></td>
</tr>
<tr>
<td data-bind="text: 'Вылет: ' + ko.utils.unwrapObservable($data.DepartureTime) + ' Прилет: ' + ko.utils.unwrapObservable($data.ArrivalTime)"></td>
</tr>
<tr>
<td data-bind="text: ko.utils.unwrapObservable($data.AirlineName)"></td>
</tr>
<tr>
<td data-bind="text: ko.utils.unwrapObservable($data.AirlineCode) + ' ' + ko.utils.unwrapObservable($data.FlightNumber)+ '. Тип ВС: ' + ko.utils.unwrapObservable($data.AirCraft)"></td>
</tr>
<tr>
<td>
<input type="button" data-bind="value: 'Купить за : ' + ko.utils.unwrapObservable($data.FinalPrice) + ' ' + ko.utils.unwrapObservable($data.Currency), click: $root.bookflight.bind($data, $data.AirlineCode)" class="btn btn-warning" name="booking" />
</td>
</tr>
</tbody>
</table>
</div>
<div class="col-md-6" id="flightsto">
<table class="table table-striped">
<tbody data-bind="foreach: flightsto">
<tr>
<td data-bind="text: ko.utils.unwrapObservable($data.CityFromName) + ' ' + ko.utils.unwrapObservable($data.AirportFromCode) + ' - ' + ko.utils.unwrapObservable($data.CityToName) + ' ' + ko.utils.unwrapObservable($data.AirportToCode)"></td>
</tr>
<tr>
<td data-bind="text: 'Вылет: ' + ko.utils.unwrapObservable($data.DepartureTime) + ' Прилет: ' + ko.utils.unwrapObservable($data.ArrivalTime)"></td>
</tr>
<tr>
<td data-bind="text: ko.utils.unwrapObservable($data.AirlineName)"></td>
</tr>
<tr>
<td data-bind="text: ko.utils.unwrapObservable($data.AirlineCode) + ' ' + ko.utils.unwrapObservable($data.FlightNumber)+ '. Тип ВС: ' + ko.utils.unwrapObservable($data.AirCraft)"></td>
</tr>
<tr>
<td>
<h1></h1>
</td>
</tr>
</tbody>
</table>
</div>
</div>
I really do not have idea how to get all parts work together. 我真的不知道如何使所有部分协同工作。
1 个解决方案
解决方案1
0 已采纳 2015-03-06 18:15:34
A few things... 一些东西...
ko.mapping.fromJS() is expecting a javascript literal response object, when your actually getting a json object. 当您实际获得json对象时， ko.mapping.fromJS()需要一个javascript文字响应对象。 From the Knockout documentation : 从淘汰赛文档中 ：
If your Ajax call returns a JSON string (and does not deserialize it into a JavaScript object), then you can use the function ko.mapping.fromJSON to create and update your view model instead.
So your ajax callback should be like the following: 因此，您的ajax回调应如下所示：
ko.mapping.fromJSON(response, self.prices());
Instead of: 代替：
self.prices(ko.toJSON(result));
ko.mapping.fromJS(result, {}, self.prices());
Also, since you haven't posted your KO ViewModel, it's not possible to tell if your JSON attribute-value pairs and your view model property-value pairs are equivalent. 另外，由于尚未发布KO ViewModel，因此无法判断JSON attribute-value对和视图模型property-value对是否相等。 This could also be causing problems. 这也可能引起问题。
And, finally, can you confirm that the .done() method of your ajax is being called? 最后，您是否可以确认正在调用ajax的.done()方法？
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.