knockout js mapping nested observable arrays - json

Question

Given this json structure:
{
"categoryID" : 1,
"categoryName" : "Stupid Questions",
"questions" : [{
"question" : [{
"questionOptions" : [{
"questionOptionID" : 1,
"optionText" : "It's top secret."
}, {
"questionOptionID" : 2,
"optionText" : "Because I am big and your small. I am right and your wrong."
}, {
"questionOptionID" : 3,
"optionText" : "I will gladly pay you Tuesday for a hamburger today."
},
],
"questionType" : "checkbox",
"questionText" : "Why can't we use more abstract table and column names?",
"summary" : "Question of the year"
}
]
}
]
}
I would like to map both the questions and questionOptions to template and templateOptions:
{
"categoryID" : 1,
"categoryName" : "Stupid Questions",
"templates" : [{
"template" : [{
"templateOptions" : [{
"templateOptionID" : 1,
"optionText" : "It is top secret."
}, {
"QuestionOptionID" : 2,
"OptionText" : "Because we are lazy."
}, {
"QuestionOptionID" : 3,
"OptionText" : "I will gladly pay you Tuesday for a hamburger today."
},
],
"QuestionType" : "checkbox",
"QuestionText" : "Why can't we use more abstract table and column names?",
"Summary" : "Question of the year"
}
]
}
]
}
Here is the start to my knockout mapping object:
var templateMapping = {
'templates': {
templates: function(data) {
return ko.utils.unwrapObservable(data.questions);
}
}
//how do I map observable array of question options to observable array of template options here?
};
The key in this mapping is that the sub objects have a different structure (unlike this question - https://stackoverflow.com/a/7535397/466321). It seems like all of the mapping examples I have found don't cover how this may get done, and I have unsuccessfully tried a couple of theories of my own.

Answer 1

#Jeff Mercado is right. The mapper is not intended for this. To accomplish what you intend, it takes a bit of recursive javascript.
function myTransform(string) {
// case-insensitive replace
return string.replace(/question/i,'template');
}
function transformObject(source) {
var result = {}
for( var key in source ) {
if( !source.hasOwnProperty(key) ) continue;
var value = source[key];
var newKey = myTransform(key);
if( Object.prototype.toString.call(value) == "[object Array]" ) {
result[newKey] = [];
for( var i in value ) {
if( !value.hasOwnProperty(i) ) continue;
result[newKey][i] = transformObject(value[i]);
}
}
else if( Object.prototype.toString.call(value) == "[object Object]" ) {
result[newKey] = transformObject(value);
}
else {
result[newKey] = value;
}
}
return result;
}
var wow = transformObject(json);
See this fiddle