Knockout.js和映射插件未深度翻译 [英] Knockout.js and mapping plugin not deep translating
本文介绍了Knockout.js和映射插件未深度翻译的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我使用json对象处理菜单和面包屑.现在在下面，您可以看到前两个导航"节点是可观察到的，但最后一个不是.由于某种原因，它只是一个常规数组.映射插件不会深度克隆对象吗?
I use a json object to handle my menus and breadcrumbs. Now below you can see that the first two "Navigation" nodes are observable, but the last one isn't. It is just a regular array for some reason. Does the mapping plugin not deep clone the object?
Firebug输出:
Firebug output:
app.viewModel.members.layout().Navigation()[2].Navigation()[1].Navigation() <-- errors
初始化:
app.viewModel.members.layout(ko.mapping.fromJS(json.Layout));
json.Layout JSON:
json.Layout JSON:
{
"Layout": {
"Navigation": [
{
"ID": "Dashboard",
"Type": "Menu",
"Route": "dashboard",
"Title": "Dashboard"
},
{
"ID": "Events",
"Type": "Menu",
"Route": "events",
"Title": "Events",
"Navigation": [
{
"ID": "AddEvent",
"Type": "Action",
"Route": "events/event",
"Title": "Add Event",
"Label": "+ Add Event",
"Order": "1"
},
{
"ID": "EditEvent",
"Type": "Item",
"Route": "events/event",
"Parameters": "eventid",
"Title": "Edit Event",
"Navigation": [
{
"ID": "EventGymCourts",
"Type": "Menu",
"Route": "events/event/gymcourts",
"Title": "Locations",
"Parameters": "eventid",
"Navigation": [
{
"ID": "AddEventGymCourt",
"Type": "Action",
"Route": "events/event/gymcourts/gymcourt",
"Title": "Add Location",
"Parameters": "eventid",
"Label": "+ Add Location",
"Order": "1"
},
{
"ID": "EditEventGymCourt",
"Type": "Item",
"Route": "events/event/gymcourts/gymcourt",
"Parameters": "eventid,gymcourtid",
"Title": "Edit Location"
}
]
},
{
"ID": "Teams",
"Type": "Menu",
"Route": "events/event/teams",
"Title": "Teams",
"Parameters": "eventid",
"Navigation": [
{
"ID": "AddTeam",
"Type": "Action",
"Route": "events/event/teams/team",
"Title": "Add Team",
"Parameters": "eventid",
"Label": "+ Add Team",
"Order": "1"
},
{
"ID": "EditTeam",
"Type": "Item",
"Route": "events/event/teams/team",
"Parameters": "eventid,teamid",
"Title": "Edit Team"
}
]
},
{
"ID": "Pools",
"Type": "Menu",
"Route": "events/event/pools",
"Title": "Pools",
"Parameters": "eventid",
"Navigation": [
{
"ID": "AddPool",
"Type": "Action",
"Route": "events/event/pools/pool",
"Title": "Add Pool",
"Parameters": "eventid",
"Label": "+ Add Pool",
"Order": "1"
},
{
"ID": "EditPool",
"Type": "Item",
"Route": "events/event/pools/pool",
"Parameters": "eventid,poolid",
"Title": "Edit Pool"
}
]
},
{
"ID": "Brackets",
"Type": "Menu",
"Route": "events/event/brackets",
"Title": "Brackets",
"Parameters": "eventid",
"Navigation": [
{
"ID": "AddBracket",
"Type": "Action",
"Route": "events/event/brackets/bracket",
"Title": "Add Bracket",
"Parameters": "eventid",
"Label": "+ Add Bracket",
"Order": "1"
},
{
"ID": "EditBracket",
"Type": "Item",
"Route": "events/event/brackets/bracket",
"Parameters": "eventid,bracketid",
"Title": "Edit Bracket"
}
]
}
]
}
]
},
{
"ID": "Gyms",
"Type": "Menu",
"Route": "gyms",
"Title": "Locations",
"Navigation": [
{
"ID": "AddGym",
"Type": "Action",
"Route": "gyms/gym",
"Title": "Add Location",
"Label": "+ Add Gym",
"Order": "1"
},
{
"ID": "EditGym",
"Type": "Item",
"Route": "gyms/gym",
"Parameters": "gymid",
"Title": "Edit Location",
"Navigation": {
"ID": "EditMap",
"Type": "Menu",
"Route": "gyms/gym/map",
"Parameters": "gymid",
"Title": "Map"
}
}
]
}
]
}
}
更新:
由于导航"只有一个节点，因此使它看起来像一个对象，而不像其他数组那样使它成为一个对象.我该如何补救?在映射插件中使用create吗?
Looking closer it looks like since that "Navigation" has only one node, it makes it one object and not an array like the others. How could I remedy this? Using create in the mapping plugin?
推荐答案
好吧，我在映射插件中使用了create方法.
Well I used the create method in the mapping plugin.
var mapping = {
'Navigation': {
create: function (options) {
if (options.data.Navigation) {
if (options.data.Navigation instanceof Array) {
options.data = ko.mapping.fromJS(options.data, mapping);
}
else{
options.data.Navigation = [options.data.Navigation];
}
}
return ko.mapping.fromJS(options.data);
}
}
};
app.viewModel.members.layout(ko.mapping.fromJS(json.Layout, mapping));
这篇关于Knockout.js和映射插件未深度翻译的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
