我有步骤#1中显示的数据,我想根据" id"
以父对象的形式重新排列相应的孩子,如步骤#2step#1:
[
{"id": "card:1.usa", "name": "usa"}, {"id": "card:2", "name": "card2"}, {"id": "card:1", "name": "card1"}, {"id": "card:2.washington", "name": "washington"},
{"id": "card:1.usa.illinios", "name": "illinios"}, {"id": "card:1.usa.illinios.city1", "name": "chicago"}
]
step#2 :
[
{"id": "card:1", "name": "card1", "children": [ {"id": "card:1.usa", "name": "usa", "children":[ {"id": "card:1.usa.illinios", "name": "illinios", "children":[ {"id": "card:1.usa.illinios.city1", "name": "chicago"}] }] } },
{"id": "card:2", "name": "card2", "children": [ {"id": "card:2.washington", "name": "washington" }] }
]
我试图从我这边做以下事情,但这只是一级孩子:
var cardData = [
{"id": "card:1.usa", "name": "usa"}, {"id": "card:2", "name": "card2"}, {"id": "card:1", "name": "card1"}, {"id": "card:2.washington", "name": "washington"},
{"id": "card:1.usa.illinios", "name": "illinios"}, {"id": "card:1.usa.illinios.city1", "name": "chicago"}
]
var subCardList = [];
$scope.parentCard = [];
for(var i=0; i<cardData.length; i++){
if( cardData[i].id.indexOf('.') > -1){
subCardList.push( cardData[i] );
}
}
for(var i=0; i<cardData.length; i++){
for(var j=0; j<subCardList.length; j++){
var cardObj = {};
if( cardData[i].id == subCardList[j].id.substr(0, subCardList[j].id.indexOf('.')) ){ //found matching parent card
cardObj.id = cardData[i].id;
cardObj.children = subCardList[j];
$scope.parentCard.push( cardObj );
}
}
}
请告诉我如何通过javascript / jquery实现这一目标?
答案 0 :(得分:0)
我已经改进了我的解决方案,使其更加全面,并且还处理层次结构中的所有卡片不存在且顺序不同的情况。
在处理之前基于id对子卡阵列执行排序。这可以确保卡的顺序不会破坏此代码。
首先收集所有顶级卡片。然后将每个子卡放入桶(儿童收集)。
我提供了额外的数据集(cardData1)以突出显示边界条件。
如果您需要更多解释,请与我们联系。
var cardData = [{
"id": "card:1.usa",
"name": "usa"
}, {
"id": "card:2",
"name": "card2"
}, {
"id": "card:1",
"name": "card1"
}, {
"id": "card:2.washington",
"name": "washington"
}, {
"id": "card:1.usa.illinios",
"name": "illinios"
}, {
"id": "card:1.usa.illinios.city1",
"name": "chicago"
}]
var cardData1 = [
{
"id": "card:1.usa.illinios.city1.municipality1",
"name": "DumDum"
},{
"id": "card:1.usa",
"name": "usa"
}, {
"id": "card:2",
"name": "card2"
}, {
"id": "card:1",
"name": "card1"
}, {
"id": "card:2.washington",
"name": "washington"
}, {
"id": "card:1.usa.illinios.city1",
"name": "chicago"
},
]
var subCardList = [];
var subCardMap = {};
var parentCardList = [];
var cardMap = {};
for (var i = 0; i < cardData.length; i++) {
if (cardData[i].id.indexOf('.') > -1) {
subCardList.push(cardData[i]);
subCardMap[cardData[i].id] = cardData[i];
} else {
//top level cards
var cardId = cardData[i].id;
var parentCard = {
id: cardId,
name: cardData[i].name,
children: []
};
cardMap[cardId] = parentCard;
parentCardList.push(parentCard);
}
}
//Sort the subcard list to ensure missing hierarchial cards do not break implementation
subCardList.sort(function (a, b) {
return a.id.toLowerCase().localeCompare(b.id.toLowerCase());
});
//Build buckets(children array) for child cards on the fly
for (var j = 0; j < subCardList.length; j++) {
var topCardId = subCardList[j].id.substr(0, subCardList[j].id.indexOf('.'));
placeInBucket(topCardId, subCardList[j]); //find matching parent card from map
}
function placeInBucket(topCardId, childCard) {
var topCard = cardMap[topCardId]; //get top card
var childIds = childCard.id.split(".");
childIds.splice(0, 1); //Remove the top card id
var childId = "";
var bucket = topCard.children; //Assign the initial bucket as the topcard children array
//loop through all the hierarchy and create complete hierarchy
for (var i = 0; i < childIds.length; i++) {
var key = topCardId + childId + "." + childIds[i];
if (!subCardMap[key]) {
childId += "." + childIds[i];
continue;
} //Do not build hierarchy for missing subcards in the id chain
var child = cardMap[key];
if (!child) {
bucket.push(childCard);
cardMap[key] = childCard; //Register new child to cardMap
break;
}
if (!child.children) child.children = []; //Add Children array to a leaf card if not existing
bucket = child.children;
childId += "." + childIds[i]; //Append the id to drill down the hierarchy
}
}
console.log(JSON.stringify(parentCardList));
&#13;
答案 1 :(得分:0)
简短的回答:你需要一个recursive function,这个函数调用自己来嵌套孩子,直到你找到一个没有孩子的元素。
首先,您会在列表中找到所有父母:
[
{"id": "card:2", "name": "card2"},
{"id": "card:1", "name": "card1"},
]
然后,对于每个这些对象,再次遍历数组,找到后代。例如,对于card:1
:
[
{"id": "card:1.usa", "name": "usa"},
{"id": "card:1.usa.illinios", "name": "illinios"},
{"id": "card:1.usa.illinios.city1", "name": "chicago"}
]
这是我们需要递归的地方:您需要再次重复相同的过程,将此数组作为输入。所以&#34;父母&#34;你会发现:
[
{"id": "card:1.usa", "name": "usa"}
]
孩子们:
[
{"id": "card:1.usa.illinios", "name": "illinios"},
{"id": "card:1.usa.illinios.city1", "name": "chicago"}
]
既然你还有孩子,你会再次重复,直到你再找不到孩子为止。
这个例子可能不是那么干净(我不知道如何处理id),但它有效:
function nestChildren(list, startIndex){
var parents = [];
// Search list for "parents" --> objects with only one period-separated section
for(var i=0;i<list.length;i++){
var ids = list[i].id.substring(startIndex).split('.'); // Count only sections from parent id
if (ids.length == 1){
parents.push(list[i]);
}
}
for(var i=0;i<parents.length;i++){
var parent = parents[i];
var children = [];
// Search list for "children" --> objects with ids that start with the parent id
for(var j=0;j<list.length;j++){
if (list[j].id.indexOf(parent.id) == 0 && list[j].id != parent.id){
children.push(list[j]);
}
}
if (children.length){
// If there's any children, nest those children too
// Pass the found children as the "list" parameter
// and the parent's id length as the second (to count periods from that index)
parent.children = nestChildren(children, parent.id.length + 1);
}
}
return parents;
}