サーバーがクライアントに複雑なオブジェクトを送信し、目標が C# の「foreach」から KnockoutJS の「data-bind="foreach:」に移行することである場合、ショッピング カートにさまざまな情報を入力する次のコードを検討してください。
@{
foreach (var item in GetItems(Model))
{
<dt>
<input type="radio" id='mode_@(item.ID)' name="mode" value="@item.ID" />
@item.Label - $@item.PriceToAdd
</dt>
<dd>
@Html.Raw(item.Explanation) </dd>
}
}
}
ビューをレンダリングする前にオブジェクトを平坦化するようにサーバーのコードを調整する必要がありますか? サーバーが JSON を送信すると簡単になりますか?
フォローアップ: 質問がプラグインのマッピングに要約されることが明らかになり、mfanto の最初の回答が私をそこに導きます:
self.items = ko.mapping.fromJS(@Html.Raw(JsonConvert.SerializeObject(Model.Items)));
firebug は次の出力を表示します:
self.items = ko.mapping.fromJS([{"ID":60},{"ID":62},{"ID":63},{"ID":64},{"ID":9}]);
アイテムの 1 つ (id=9) に他の要素とは異なる要素があるため、マッパーが失敗する可能性があります。
おそらく、マッパーのより高度な使用法の1つを調査する必要がありますか?
書式設定された出力は、JsonConvert と JavaScriptSerializer によって返される値を比較します
...
self.itemsJSON = ko.mapping.fromJS(@Html.Raw(JsonConvert.SerializeObject(Model.Items)));
self.items = @Html.Raw(new JavaScriptSerializer().Serialize(Model.Items));
上記のコードが Firebug のブレークポイントにレンダリングされる場合:
self.itemsJSON = ko.mapping.fromJS([{"ID":60},{"ID":62},{"ID":63},{"ID":64},{"ID":9}]);
self.items = [ //line breaks inserted for clarity
{"Explanation":"Item1's text.","Label":"Item1's Label","MsgConfirm":null,"PriceToAdd":1255,"TaxExempt":false,"PercentToAdd":0,"SortOrder":1,"ID":60},
{"Explanation":"Item2's text.","Label":"Item2's Label","MsgConfirm":null,"PriceToAdd":1255,"TaxExempt":false,"PercentToAdd":0,"SortOrder":2,"ID":62},
{"Explanation":"Item3's text.","Label":"Item3's Label","MsgConfirm":null,"PriceToAdd":295,"TaxExempt":false,"PercentToAdd":0,"SortOrder":3,"ID":63},
{"Explanation":"Item4's text.","Label":"Item4's Label","MsgConfirm":null,"PriceToAdd":395,"TaxExempt":false,"PercentToAdd":0,"SortOrder":4,"ID":64},
{"Explanation":null,"Label":"[foo]","MsgConfirm":null,"PriceToAdd":150,"TaxExempt":false,"PercentToAdd":0,"SortOrder":99,"ID":9}
];
どうも