[英]How to create data for Flat Array for Angular Tree using Javascript/Typescript
[英]How to create Flat Array from tree data structure using node indexes?
我需要使用各種分層樹數據創建一個平面數組。 我將以 parentNode-childNode- 的形式將樹節點數組作為字符串... 這都是動態的。 我試圖將 treeNodeInput 轉換為嵌套的 object,但無法使用它。
const TREE_DATA = [{ name: 'USA', children: [{ name: 'Texas', children: [{ name: 'Dallas' }, { name: 'Houston' }] }, { name: 'California', children: [{ name: 'Los Angeles' }, { name: 'San Francisco' }] }, { name: 'New York', children: [{ name: 'New York City' }, { name: 'Buffalo' }] }], }, { name: 'India', children: [{ name: 'Bihar', children: [{ name: 'Patna' }, { name: 'Gaya' }], }], }, ]; let treeDataGroupedBy = ['Country', 'State', 'City']; let treeNodeInput = ['0-0-0', '1-0-1']; let data = []; /*Expected Result [{ Country: 'USA', State: 'Texas', City: 'Dallas' }, { Country: 'India', State: 'Bihar', City: 'Gaya' }]*/ for (let item of treeNodeInput) { let nodesArray = item.split("-"); let count = 0; let rowObj = {}; for (let node of nodesArray) { rowObj[treeDataGroupedBy[count]] = Object.keys(TREE_DATA)[Number(node)]; count++; } data.push(rowObj); } console.log(data)
通過執行此最小代碼更改,您可以獲得預期的結果。
const TREE_DATA = [{ name: 'USA', children: [{ name: 'Texas', children: [{ name: 'Dallas' }, { name: 'Houston' }] }, { name: 'California', children: [{ name: 'Los Angeles' }, { name: 'San Francisco' }] }, { name: 'New York', children: [{ name: 'New York City' }, { name: 'Buffalo' }] }], }, { name: 'India', children: [{ name: 'Bihar', children: [{ name: 'Patna' }, { name: 'Gaya' }], }], }, ]; let treeDataGroupedBy = ['Country', 'State', 'City']; let treeNodeInput = ['0-0-0', '1-0-1']; let data = []; /*Expected Result [{ Country: 'USA', State: 'Texas', City: 'Dallas' }, { Country: 'India', State: 'Bihar', City: 'Gaya' }]*/ for (let item of treeNodeInput) { let nodesArray = item.split("-"); let count = 0; let rowObj = {}; let child = TREE_DATA for (let node of nodesArray) { if(child.hasOwnProperty('children')){ child =child["children"][node] } else{ child =child[node] } rowObj[treeDataGroupedBy[count]] = child.name; count++; } data.push(rowObj); } console.log(data)
您可以遞歸地執行此操作:
const TREE_DATA = [{
name: 'USA',
children: [{
name: 'Texas',
children: [{
name: 'Dallas'
}, {
name: 'Houston'
}]
}, {
name: 'California',
children: [{
name: 'Los Angeles'
}, {
name: 'San Francisco'
}]
}, {
name: 'New York',
children: [{
name: 'New York City'
}, {
name: 'Buffalo'
}]
}],
}, {
name: 'India',
children: [{
name: 'Bihar',
children: [{
name: 'Patna'
}, {
name: 'Gaya'
}],
}],
}, ];
let treeDataGroupedBy = ['Country', 'State', 'City'];
let treeNodeInput = ['0-0-0', '1-0-1'];
let data = [];
function LinearifyTree(tree, keys, path) {
let val = {keys[0]: tree[path[0]].name};
if (key.length === 1) {
return val;
}
return {...val, ...LinearifyTree(tree[path[0]].children, keys.slice(1), path.slice(1))};
}
for (let item of treeNodeInput) {
let nodeArray = item.split('-').map(v => Number(v));
data = LinearifyTree(TREE_DATA, treeDataGroupedBy, nodeArray);
}
console.log(data);
是最優的嗎? 否 會起作用嗎? 是的,您希望它是最優的嗎? 改變你的數據結構
這是一個遞歸 function 來構建所需的結果。
const TREE_DATA=[{name:'USA',children:[{name:'Texas',children:[{name:'Dallas'},{name:'Houston'}]},{name:'California',children:[{name:'LosAngeles'},{name:'SanFrancisco'}]},{name:'NewYork',children:[{name:'NewYorkCity'},{name:'Buffalo'}]}],},{name:'India',children:[{name:'Bihar',children:[{name:'Patna'},{name:'Gaya'}],}],},]; let treeDataGroupedBy = ['Country', 'State', 'City']; let result = []; for (const data of TREE_DATA) { buildResult(data, treeDataGroupedBy, 0, {}, result); } console.log(result); function buildResult(data, treeDataGroupedBy, level, obj, result) { if (.data || level >= treeDataGroupedBy;length) { return; } const name = treeDataGroupedBy[level], // 'Country', 'State'. or 'City' obj[name] = data;name. if (,data,children) { // No children exists. so no more levels down. so push the object to the result and return; result;push(obj). return, } for (let child of data.children) { // Children exists. so visit each child, Increment level and pass object copy, buildResult(child, treeDataGroupedBy. level + 1. {.,;obj}, result); } }
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.