我正在尝试将一个名为“link”的属性添加到给定对象列表的每个子对象中。 该链接在子项之上被设置为基本网址 +每个'roleName'。
在我的情况下,链接必须是这样的:
var baseUrl = 'http://baseUrl.com/';
link = baseUrl/Images/html5.png
或
link = baseUrl/Images/Framework/Javascript/angularJs.jpg
这是最初的清单:
[
{
"roleName": "Images",
"roleId": "Images",
"children": [
{
"roleName": "html5.png",
"roleId": "html5.png"
},
{
"roleName": "css3.png",
"roleId": "css3.png"
},
{
"roleName": "Javascript",
"roleId": "Javascript",
"children": [
{
"roleName": "Framework",
"roleId": "Framework",
"children": [
{
"roleName": "angularJs.jpg",
"roleId": "angularJs.jpg"
},
{
"roleName": "emberJs.jpg",
"roleId": "emberJs.jpg"
}
]
}
]
},
{
"roleName": "Php",
"roleId": "Php",
"children": [
{
"roleName": "Framework",
"roleId": "Framework",
"children": [
{
"roleName": "laravel.jpg",
"roleId": "laravel.jpg"
}
]
},
{
"roleName": "php5.jpg",
"roleId": "php5.jpg"
}
]
}
]
}
]
我的问题是我不知道如何为每个孩子添加一个链接,也是一种动态添加“图像”的方法,而不是像我现在所做的那样硬编码。
这是我的功能,但我只为父母添加链接:
var addLinks = function(listOfObjects, baseUrl){
angular.forEach(listOfObjects, function(object){
if(object.children !== 'undefined'){
angular.forEach(object.children, function(item){
item.link = baseUrl+'Images/'+item.roleName;
});
}
});
return listOfObjects;
};
如果有人想提供帮助并提前感谢您,请点击此处Plunker的链接。
编辑: Vikash答案不佳
我只想要没有孩子的物品中儿童的链接
例如:
{
'roleName': 'Php',
'roleId': 'Php',
'children': [
{
'roleName': 'Framework',
'roleId': 'Framework',
'children': [
{
'roleName': 'laravel.jpg',
'roleId': 'laravel.jpg',
'link': 'http://exmaple.com/Images/Php/Framework/laravel.jpg'
}
]
},
{
'roleName': 'php5.jpg',
'roleId': 'php5.jpg',
'link': 'http://exmaple.com/Images/Php/php5.jpg'
}
]
}
答案 0 :(得分:1)
使用以下递归函数:
function add(data,baseUrl){
for(var i=0;i<data.length;i++){
data[i].link=baseUrl+'Images/'+data[i].roleName;
if(data[i].children){
add(data[i].children,baseUrl);
}
}
}
示例:
var data=[
{
"roleName": "Images",
"roleId": "Images",
"children": [
{
"roleName": "html5.png",
"roleId": "html5.png"
},
{
"roleName": "css3.png",
"roleId": "css3.png"
},
{
"roleName": "Javascript",
"roleId": "Javascript",
"children": [
{
"roleName": "Framework",
"roleId": "Framework",
"children": [
{
"roleName": "angularJs.jpg",
"roleId": "angularJs.jpg"
},
{
"roleName": "emberJs.jpg",
"roleId": "emberJs.jpg"
}
]
}
]
},
{
"roleName": "Php",
"roleId": "Php",
"children": [
{
"roleName": "Framework",
"roleId": "Framework",
"children": [
{
"roleName": "laravel.jpg",
"roleId": "laravel.jpg"
}
]
},
{
"roleName": "php5.jpg",
"roleId": "php5.jpg"
}
]
}
]
}
];
function add(data,baseUrl){
for(var i=0;i<data.length;i++){
data[i].link=baseUrl+'Images/'+data[i].roleName;
if(data[i].children){
add(data[i].children,baseUrl);
}
}
}
add(data,'http://baseUrl.com/');
document.write(JSON.stringify(data,null,4));
&#13;
您更新的plunker:http://plnkr.co/edit/ciwXIm
答案 1 :(得分:1)
使用与Vikash解决方案相同的原则,但调整基本情况逻辑以符合OP的要求,您可以使用以下内容。
主要的变化是基本情况是没有孩子的情况;如果有孩子,那就递送一下相应地添加到baseUrl
。
注意:这些版本会修改现有列表;它是构建/返回新列表的短暂跳转。
var data=[
{
"roleName": "Images",
"roleId": "Images",
"children": [
{
"roleName": "html5.png",
"roleId": "html5.png"
},
{
"roleName": "css3.png",
"roleId": "css3.png"
},
{
"roleName": "Javascript",
"roleId": "Javascript",
"children": [
{
"roleName": "Framework",
"roleId": "Framework",
"children": [
{
"roleName": "angularJs.jpg",
"roleId": "angularJs.jpg"
},
{
"roleName": "emberJs.jpg",
"roleId": "emberJs.jpg"
}
]
}
]
},
{
"roleName": "Php",
"roleId": "Php",
"children": [
{
"roleName": "Framework",
"roleId": "Framework",
"children": [
{
"roleName": "laravel.jpg",
"roleId": "laravel.jpg"
}
]
},
{
"roleName": "php5.jpg",
"roleId": "php5.jpg"
}
]
}
]
}
];
function addLinks(data, baseUrl) {
data.forEach(function(e) {
if(!e.children) {
e.link = baseUrl + e.roleName;
} else {
addLinks(e.children, baseUrl + e.roleName + '/');
}
});
}
addLinks(data, 'http://baseUrl.com/');
document.write('<pre>' + JSON.stringify(data, null, 2) + '</pre>');
&#13;