We Keep Coding

How to change the format of an array of objects based on ParentID

I am trying to change the format of an array of objects based on a field called ParentID.
Here is a sample of data:
var JsonVal = "data": {
"Factorid": 197325,
"orders": [
{
"pID": 794522,
"Count": 1,
"ParentID": 794551,
"Description": "",
"productid": "1428539",
"UnitPrice": "300000",
},
{
"pID": 794525,
"Count": 1,
"ParentID": 794551,
"Description": "",
"productid": "1428543",
"UnitPrice": "600000",
},
{
"pID": 794550,
"Count": 2,
"ParentID": 0,
"Description": "",
"productid": "1428648",
"UnitPrice": "60000",
},
{
"pID": 794551,
"Count": 1,
"ParentID": 0,
"Description": "",
"productid": "1428647",
"UnitPrice": "250000",
} ,
{
"pID": 794526,
"Count": 3,
"ParentID": 794550,
"Description": "",
"productid": "1428548",
"UnitPrice": "600000",
},
{
"pID": 794527,
"Count": 1,
"ParentID": 0,
"Description": "",
"productid": "1428542",
"UnitPrice": "400000",
},
]
}
As you can see every object has a ParentID. I want to say that if ParentID is 0, it will be known as a parent and add a field call children which its value is null. However if ParentID is not 0 , it will mean that this Object is a child of another Object that its pID is the same as ParentID child Object.The final JSON should be like this :
"data": {
"Factorid": 197325,
"orders": [
{
"pID": 794550,
"Count": 2,
"ParentID": 0,
"Description": "",
"productid": "1428648",
"UnitPrice": "60000",
"children": "[{
'pID': 794526,
'Count':3,
'ParentID': 794550,
'Description': '',
'productid': '1428548',
'UnitPrice': '600000',
}]",
},
{
"pID": 794551,
"Count": 1,
"ParentID": 0,
"Description": "",
"productid": "1428647",
"UnitPrice": "250000",
"children":"[
{
'pID': 794522,
'Count': 1,
'ParentID': 794551,
'Description': '',
'productid': '1428539',
'UnitPrice': '300000',
},
{
'pID': 794525,
'Count': 1,
'ParentID': 794551,
'Description': '',
'productid': '1428543',
'UnitPrice': '600000',
},
]",
} ,
{
"pID": 794527,
"Count": 1,
"ParentID": 0,
"Description": "",
"productid": "1428542",
"UnitPrice": "400000",
"children":"",
},
]
}
children should be added to any object which is parent and also children is always a string field.
I wrote a code but I do not know how to handle it?
JsonVal.orders.forEach(orders => {
if(orders.ParentID == 0){
orders.children="";
}else{
if(orders.ParentID == new_rows){
JsonVal.orders = JsonVal.orders.filter(item => item.ParentID == orders.ParentID);
}
}
});

You basically filter your list of orders if it is a "rootOrder" which means that it has one or multiple children.
Next, you filter your list again by matching the ParentId to the root.pID
// input
const JsonVal = {
data: {
Factorid: 197325,
orders: [
{
pID: 794522,
Count: 1,
ParentID: 794551,
Description: "",
productid: "1428539",
UnitPrice: "300000",
},
{
pID: 794525,
Count: 1,
ParentID: 794551,
Description: "",
productid: "1428543",
UnitPrice: "600000",
},
{
pID: 794550,
Count: 2,
ParentID: 0,
Description: "",
productid: "1428648",
UnitPrice: "60000",
},
{
pID: 794551,
Count: 1,
ParentID: 0,
Description: "",
productid: "1428647",
UnitPrice: "250000",
},
{
pID: 794526,
Count: 3,
ParentID: 794550,
Description: "",
productid: "1428548",
UnitPrice: "600000",
},
{
pID: 794527,
Count: 1,
ParentID: 0,
Description: "",
productid: "1428542",
UnitPrice: "400000",
},
],
},
};
function mapOrders(orders) {
const rootOrders = orders.filter((order) => order.ParentID === 0);
return rootOrders.map((rootOrder) => {
const children = orders.filter((order) => order.ParentID === rootOrder.pID);
return {
...rootOrder,
children: children.length ? children : "",
};
});
}
// output
const mappedJsonVal = {
...JsonVal,
data: {
...JsonVal.data,
orders: mapOrders(JsonVal.data.orders),
},
};

Loop through object javascript

This is my response body. I want to select only Collaborator's "supportNotifications" key-value set to true, how can I do that?
{
"status": true,
"date": "2022-04-06T16:33:13.630Z",
"data": {
"collaborators": [
{
"name": "Paul",
"lastCheckin": "2022-03-31T19:54:50.584Z",
"sales": 1,
"createdAt": "2022-03-30T14:47:48.478Z",
"id": "62446d4ab7f4da001e8f40dc",
"supportNotification": true,
"collaboratorId": 1
},
{
"name": "John",
"lastCheckin": null,
"sales": 0,
"createdAt": "2022-03-01",
"id": "62446ea4b7f4da001e8f40df",
"supportNotification": false,
"collaboratorId": 6
}
],
"count": 2
}
}

let response = {
"status": true,
"date": "2022-04-06T16:33:13.630Z",
"data": {
"collaborators": [
{
"name": "Paul",
"lastCheckin": "2022-03-31T19:54:50.584Z",
"sales": 1,
"createdAt": "2022-03-30T14:47:48.478Z",
"id": "62446d4ab7f4da001e8f40dc",
"supportNotification": true,
"collaboratorId": 1
},
{
"name": "John",
"lastCheckin": null,
"sales": 0,
"createdAt": "2022-03-01",
"id": "62446ea4b7f4da001e8f40df",
"supportNotification": false,
"collaboratorId": 6
}
],
"count": 2
}
};
const collaborators = response.data.collaborators.filter(c => c.supportNotification);

This will give you each collaborator object that has supportNotification = true. Is this the result you are trying to select?
var body = {
status: true,
date: "2022-04-06T16:33:13.630Z",
data: {
collaborators: [
{
name: "Paul",
lastCheckin: "2022-03-31T19:54:50.584Z",
sales: 1,
createdAt: "2022-03-30T14:47:48.478Z",
id: "62446d4ab7f4da001e8f40dc",
supportNotification: true,
collaboratorId: 1,
},
{
name: "John",
lastCheckin: null,
sales: 0,
createdAt: "2022-03-01",
id: "62446ea4b7f4da001e8f40df",
supportNotification: false,
collaboratorId: 6,
},
],
count: 2,
},
};
var result = [];
body.data.collaborators.forEach((item) => {
if (item.supportNotification === true) {
result.push(item);
}
});
console.log(result);

How to group by array object and create array with value key javascript

How to group by array object from values to create new array object of values
Input
var promotions = [
{
"promotionID": 2,
"id": 1,
"qty": 1,
"productID": 1,
"product": "Nu Milk Tea 330ml",
"operator": null
}, {
"promotionID": 2,
"id": 2,
"qty": 2,
"productID": 2,
"product": "Product testing 2",
"operator": 1
}, {
"promotionID": 2,
"id": 3,
"qty": 3,
"productID": 3,
"product": "Golda Coffee Dolce Latte 200ml",
"operator": 2
}, {
"promotionID": 3,
"id": 4,
"qty": 8,
"productID": 54,
"product": "Masker Skrineer 3ply Motif 5pcs",
"operator": null
}, {
"promotionID": 3,
"id": 5,
"qty": 5,
"productID": 53,
"product": "Masker Skrineer 1ply Grey 5pcs",
"operator": 2
}, {
"promotionID": 3,
"id": 6,
"qty": 5,
"productID": 52,
"product": "Oronamin C Drink 120ml",
"operator": 1
}]
I want to make a new array of car objects that's grouped by promotionID
Expected Output
[
{
"promotionID": 2,
"data" : [
{
"promotionID": 2,
"id": 1,
"qty": 1,
"productID": 1,
"product": "Nu Milk Tea 330ml",
"operator": null
}, {
"promotionID": 2,
"id": 2,
"qty": 2,
"productID": 2,
"product": "Product testing 2",
"operator": 1
}, {
"promotionID": 2,
"id": 3,
"qty": 3,
"productID": 3,
"product": "Golda Coffee Dolce Latte 200ml",
"operator": 2
}
]
},
{
"promotionID": 3,
"data" : [
{
"promotionID": 3,
"id": 4,
"qty": 8,
"productID": 54,
"product": "Masker Skrineer 3ply Motif 5pcs",
"operator": null
}, {
"promotionID": 3,
"id": 5,
"qty": 5,
"productID": 53,
"product": "Masker Skrineer 1ply Grey 5pcs",
"operator": 2
}, {
"promotionID": 3,
"id": 6,
"qty": 5,
"productID": 52,
"product": "Oronamin C Drink 120ml",
"operator": 1
}
]
}
]

You could use reduce to group promotion by promotionId and then map through the entries to get the final result
var promotions = [
{
promotionID: 2,
id: 1,
qty: 1,
productID: 1,
product: 'Nu Milk Tea 330ml',
operator: null
},
{
promotionID: 2,
id: 2,
qty: 2,
productID: 2,
product: 'Product testing 2',
operator: 1
},
{
promotionID: 2,
id: 3,
qty: 3,
productID: 3,
product: 'Golda Coffee Dolce Latte 200ml',
operator: 2
},
{
promotionID: 3,
id: 4,
qty: 8,
productID: 54,
product: 'Masker Skrineer 3ply Motif 5pcs',
operator: null
},
{
promotionID: 3,
id: 5,
qty: 5,
productID: 53,
product: 'Masker Skrineer 1ply Grey 5pcs',
operator: 2
},
{
promotionID: 3,
id: 6,
qty: 5,
productID: 52,
product: 'Oronamin C Drink 120ml',
operator: 1
}
]
const res = Array.from(
promotions
.reduce((acc, promotion) => {
acc.set(
promotion.promotionID,
(acc.get(promotion.promotionID) || []).concat(promotion)
)
return acc
}, new Map)
.entries(),
([promotionId, data]) => ({ promotionId, data })
)
console.log(res)

This is my answer
var promotions = [
{
promotionID: 2,
id: 1,
qty: 1,
productID: 1,
product: "Nu Milk Tea 330ml",
operator: null,
},
{
promotionID: 2,
id: 2,
qty: 2,
productID: 2,
product: "Product testing 2",
operator: 1,
},
{
promotionID: 2,
id: 3,
qty: 3,
productID: 3,
product: "Golda Coffee Dolce Latte 200ml",
operator: 2,
},
{
promotionID: 3,
id: 4,
qty: 8,
productID: 54,
product: "Masker Skrineer 3ply Motif 5pcs",
operator: null,
},
{
promotionID: 3,
id: 5,
qty: 5,
productID: 53,
product: "Masker Skrineer 1ply Grey 5pcs",
operator: 2,
},
{
promotionID: 3,
id: 6,
qty: 5,
productID: 52,
product: "Oronamin C Drink 120ml",
operator: 1,
},
];
const objectPromotion = {};
for (index in promotions) {
const dataPromotion = objectPromotion[promotions[index].promotionID];
console.log("dataPromotion", dataPromotion)
if (dataPromotion) {
dataPromotion.push(promotions[index]);
} else {
objectPromotion[promotions[index].promotionID] = [promotions[index]];
}
}
const result = Object.keys(objectPromotion).map((item) => {
return {
promotionID: item,
data: objectPromotion[item],
};
});
console.log("result", result)

you should use lodash like this.
const _ = require('lodash');
let filteredPromotions=_.groupBy(promotions,'promotionID');
output:
{
'2': [
{
promotionID: 2,
id: 1,
qty: 1,
productID: 1,
product: 'Nu Milk Tea 330ml',
operator: null
},
{
promotionID: 2,
id: 2,
qty: 2,
productID: 2,
product: 'Product testing 2',
operator: 1
},
{
promotionID: 2,
id: 3,
qty: 3,
productID: 3,
product: 'Golda Coffee Dolce Latte 200ml',
operator: 2
}
],
'3': [
{
promotionID: 3,
id: 4,
qty: 8,
productID: 54,
product: 'Masker Skrineer 3ply Motif 5pcs',
operator: null
},
{
promotionID: 3,
id: 5,
qty: 5,
productID: 53,
product: 'Masker Skrineer 1ply Grey 5pcs',
operator: 2
},
{
promotionID: 3,
id: 6,
qty: 5,
productID: 52,
product: 'Oronamin C Drink 120ml',
operator: 1
}
]
}
to get exact output add those lines:
filteredPropomotions = Object.keys(filteredPropomotions).map((key, index)=> {return{promotionID:key,data:filteredPropomotions[key]}}
);
output:
[
{
"promotionID": 2,
"data" : [
{
"promotionID": 2,
"id": 1,
"qty": 1,
"productID": 1,
"product": "Nu Milk Tea 330ml",
"operator": null
}, {
"promotionID": 2,
"id": 2,
"qty": 2,
"productID": 2,
"product": "Product testing 2",
"operator": 1
}, {
"promotionID": 2,
"id": 3,
"qty": 3,
"productID": 3,
"product": "Golda Coffee Dolce Latte 200ml",
"operator": 2
}
]
},
{
"promotionID": 3,
"data" : [
{
"promotionID": 3,
"id": 4,
"qty": 8,
"productID": 54,
"product": "Masker Skrineer 3ply Motif 5pcs",
"operator": null
}, {
"promotionID": 3,
"id": 5,
"qty": 5,
"productID": 53,
"product": "Masker Skrineer 1ply Grey 5pcs",
"operator": 2
}, {
"promotionID": 3,
"id": 6,
"qty": 5,
"productID": 52,
"product": "Oronamin C Drink 120ml",
"operator": 1
}
]
}
]

Group array by StudentId and find sum of subarrays with same element

[
{
"id": 1,
"subject": "FUNDAMENTALS OF INFORMATION TECHNOLOGY",
"present": "false",
"date": "2018-03-04",
"createdAt": "2018-03-04T14:06:18.000Z",
"updatedAt": "2018-03-04T14:06:18.000Z",
"SemesterId": 1,
"BatchId": 1,
"StudentId": 1,
"Student": {
"id": 1,
"rollnumber": 11111,
"studentname": "LAWANNA HAUGHT",
"dateofbirth": "1997-1-01",
"mobilenumber": "9875449112",
"createdAt": "2018-03-03T14:59:01.000Z",
"updatedAt": "2018-03-03T14:59:01.000Z",
"BatchId": 1
}
},
{
"id": 7,
"subject": "COMPUTER ORGANIZATION",
"present": "true",
"date": "2018-03-04",
"createdAt": "2018-03-04T14:09:12.000Z",
"updatedAt": "2018-03-04T14:09:12.000Z",
"SemesterId": 1,
"BatchId": 1,
"StudentId": 1,
"Student": {
"id": 1,
"rollnumber": 11111,
"studentname": "LAWANNA HAUGHT",
"dateofbirth": "1997-1-01",
"mobilenumber": "9875449112",
"createdAt": "2018-03-03T14:59:01.000Z",
"updatedAt": "2018-03-03T14:59:01.000Z",
"BatchId": 1
}
},
{
"id": 2,
"subject": "FUNDAMENTALS OF INFORMATION TECHNOLOGY",
"present": "true",
"date": "2018-03-04",
"createdAt": "2018-03-04T14:06:18.000Z",
"updatedAt": "2018-03-04T14:06:18.000Z",
"SemesterId": 1,
"BatchId": 1,
"StudentId": 2,
"Student": {
"id": 2,
"rollnumber": 11112,
"studentname": "KAILA HALBROOK",
"dateofbirth": "1997-1-01",
"mobilenumber": "9875449113",
"createdAt": "2018-03-03T14:59:01.000Z",
"updatedAt": "2018-03-03T14:59:01.000Z",
"BatchId": 1
}
},
{
"id": 8,
"subject": "COMPUTER ORGANIZATION",
"present": "false",
"date": "2018-03-04",
"createdAt": "2018-03-04T14:09:12.000Z",
"updatedAt": "2018-03-04T14:09:12.000Z",
"SemesterId": 1,
"BatchId": 1,
"StudentId": 2,
"Student": {
"id": 2,
"rollnumber": 11112,
"studentname": "KAILA HALBROOK",
"dateofbirth": "1997-1-01",
"mobilenumber": "9875449113",
"createdAt": "2018-03-03T14:59:01.000Z",
"updatedAt": "2018-03-03T14:59:01.000Z",
"BatchId": 1
}
}
]
This is an attendance record of one batch.
I'm trying to transform this array to the following form.
All the records with a particular StudentId must be together with one StudentId and studentname.
[
{
"StudentId": 1,
"studentname": "LAWANNA HAUGHT",
"rollnumber": 11111,
"attendance": [
{
"subject": "FUNDAMENTALS OF INFORMATION TECHNOLOGY",
"present": 0,
"absent": 1,
"total": 1
},
{
"subject": "COMPUTER ORGANIZATION",
"present": 1,
"absent": 0,
"total": 1
}
]
},
{
"StudentId": 2,
"studentname": "KAILA HALBROOK",
"rollnumber": 11111,
"attendance": [
{
"subject": "FUNDAMENTALS OF INFORMATION TECHNOLOGY",
"present": 1,
"absent": 0,
"total": 1
},
{
"subject": "COMPUTER ORGANIZATION",
"present": 0,
"absent": 1,
"total": 1
}
]
}
]
present is the number of rows with same StudentId and subjectname and present=true
absent is the number of rows with same StudentId and subjectname and present=false
total is the number of rows with same StudentId and subjectname.
This is the code I have written with the help of one StackOverflow answer and using underscore.js.
But it finds present, absent and total values of all, not by StudentId and subject.
var groups = _.groupBy(list, 'StudentId');
var result = _.map(groups, function(student){
return {
StudentId: student[0].StudentId,
studentname: student[0].Student.studentname,
rollnumber: student[0].Student.rollnumber,
attendances: _.map(student, function(item){
return {
subject:item.subject,
present: _.reduce(item, function(memo, att){
if(att.present=='true')
return memo + 1;
else
return memo;
}, 0),
absent: _.reduce(item, function(memo, att){
if(att.present=='false')
return memo + 1;
else
return memo;
}, 0),
total: _.reduce(item, function(memo, att){
return memo + 1;
}, 0)
}
})
})
}
}
);

You could use a nested approach by looking for strunden and later for looking for attendance.
var data = [{ id: 1, subject: "FUNDAMENTALS OF INFORMATION TECHNOLOGY", present: "false", date: "2018-03-04", createdAt: "2018-03-04T14:06:18.000Z", updatedAt: "2018-03-04T14:06:18.000Z", SemesterId: 1, BatchId: 1, StudentId: 1, Student: { id: 1, rollnumber: 11111, studentname: "LAWANNA HAUGHT", dateofbirth: "1997-1-01", mobilenumber: "9875449112", createdAt: "2018-03-03T14:59:01.000Z", updatedAt: "2018-03-03T14:59:01.000Z", BatchId: 1 } }, { id: 7, subject: "COMPUTER ORGANIZATION", present: "true", date: "2018-03-04", createdAt: "2018-03-04T14:09:12.000Z", updatedAt: "2018-03-04T14:09:12.000Z", SemesterId: 1, BatchId: 1, StudentId: 1, Student: { id: 1, rollnumber: 11111, studentname: "LAWANNA HAUGHT", dateofbirth: "1997-1-01", mobilenumber: "9875449112", createdAt: "2018-03-03T14:59:01.000Z", updatedAt: "2018-03-03T14:59:01.000Z", BatchId: 1 } }, { id: 2, subject: "FUNDAMENTALS OF INFORMATION TECHNOLOGY", present: "true", date: "2018-03-04", createdAt: "2018-03-04T14:06:18.000Z", updatedAt: "2018-03-04T14:06:18.000Z", SemesterId: 1, BatchId: 1, StudentId: 2, Student: { id: 2, rollnumber: 11112, studentname: "KAILA HALBROOK", dateofbirth: "1997-1-01", mobilenumber: "9875449113", createdAt: "2018-03-03T14:59:01.000Z", updatedAt: "2018-03-03T14:59:01.000Z", BatchId: 1 } }, { id: 8, subject: "COMPUTER ORGANIZATION", present: "false", date: "2018-03-04", createdAt: "2018-03-04T14:09:12.000Z", updatedAt: "2018-03-04T14:09:12.000Z", SemesterId: 1, BatchId: 1, StudentId: 2, Student: { id: 2, rollnumber: 11112, studentname: "KAILA HALBROOK", dateofbirth: "1997-1-01", mobilenumber: "9875449113", createdAt: "2018-03-03T14:59:01.000Z", updatedAt: "2018-03-03T14:59:01.000Z", BatchId: 1 } }],
grouped = [];
data.forEach(({ subject, present, StudentId, Student: { rollnumber, studentname } }) => {
var student = grouped.find(g => StudentId === g.StudentId),
attendance;
if (!student) {
student = { StudentId, studentname, rollnumber, attendance: [] };
grouped.push(student);
}
attendance = student.attendance.find(a => a.subject === subject);
if (!attendance) {
attendance = { subject, present: 0, absent: 0, total: 0 };
student.attendance.push(attendance);
}
attendance[{ true: 'present', false: 'absent' }[present]]++;
attendance.total++;
});
console.log(grouped);
.as-console-wrapper { max-height: 100% !important; top: 0; }

Okay, this came out a little weird. If you are coding the backend, it may make sense to handle this on the query end. That being said, you can use reduce to "collapse" the array into an object based on the StudentId. In this process, you can build out the shape of what the record should look like. I don't this is a standard way of using reduce since you are transforming an array. That being said, I couldn't think of an easy way of using map. The result of this operation gives us an object, we can get it back to an array using Object.values(). I don't understand the use case for present, absent, and total.
Here is the JSFiddle.
function isolateRecords(data) {
return Object.values(data.reduce((accum, current) => {
let attenance = {
subject: current.subject,
present: current.present === "true" ? 1 : 0,
absent: current.present === "false" ? 1 : 0,
total: 0
};
attenance.total = attenance.present + attenance.absent;
if (accum[current.StudentId]) {
accum[current.StudentId].attendance.push(attenance);
} else {
accum[current.StudentId] = {
StudentId: current.StudentId,
studentname: current.Student.studentname,
rollnumber: current.Student.rollnumber,
attendance: [attenance]
}
}
return accum;
}, {}));
}
isolateRecords(myOriginalArrayOfRecords);

Modifying ng-table

I'm trying to modify ng-table to create expandable nodes/treeview,
Plunker example
The JSON structure is specified based on ID's.
[
{
"BodyId": 1,
"TrId": null,
"TdId": null,
"Title": "BodyId1",
"Status": "Ok"
}, {
"BodyId": 2,
"TrId": null,
"TdId": null,
"Title": "BodyId2",
"Status": "Ok"
}, {
"BodyId": 3,
"TrId": null,
"TdId": null,
"Title": "BodyId3",
"Status": "Ok"
}, {
"BodyId": 1,
"TrId": 1,
"TdId": null,
"Title": "TrId1",
"Status": "Ok"
}, {
"BodyId": 1,
"TrId": 2,
"TdId": null,
"Title": "TrId2",
"Status": "Ok"
}, {
"BodyId": 2,
"TrId": 1,
"TdId": null,
"Title": "TrId1",
"Status": "Ok"
}, {
"BodyId": 2,
"TrId": 2,
"TdId": null,
"Title": "TrId2",
"Status": "Ok"
}, {
"BodyId": 3,
"TrId": 1,
"TdId": null,
"Title": "TrId1",
"Status": "Ok"
}, {
"BodyId": 3,
"TrId": 2,
"TdId": null,
"Title": "TrId2",
"Status": "Ok"
}, {
"BodyId": 1,
"TrId": 1,
"TdId": 1,
"Title": "TdId1",
"Status": "Ok"
}, {
"BodyId": 1,
"TrId": 1,
"TdId": 2,
"Title": "TdId2",
"Status": "Ok"
}, {
"BodyId": 1,
"TrId": 2,
"TdId": "1",
"Title": "TdId1",
"Status": "Ok"
}, {
"BodyId": 2,
"TrId": 1,
"TdId": 1,
"Title": "TdId1",
"Status": "Ok"
}, {
"BodyId": 2,
"TrId": 1,
"TdId": 2,
"Title": "TdId2",
"Status": "Ok"
}, {
"BodyId": 2,
"TrId": 2,
"TdId": 1,
"Title": "TdId1",
"Status": "Ok"
}, {
"BodyId": 3,
"TrId": 3,
"TdId": 1,
"Title": "TdId1",
"Status": "Ok"
}]
I managed to display parent node by:
<tbody>
<tr ng-repeat="node in $data" ng-show="node.TrId == null && node.TdId == null">
<td ng-repeat="column in columns" ng-show="column.visible " sortable="column.field">
<span ng-show="column.field == 'Title'"><i class="glyphicon" ng-class="{'glyphicon-minus' : node.expanded, 'glyphicon-plus' : !node.expanded}"></i></span>
{{node[column.field]}}
</td>
</tr>
</tbody>
And here I'm stuck because I don't know how to attach below each parent node the corresponding child nodes and make all expandable after click.
Would be a good solution to parse this JSON structure and change it to JSON like would that make this problem easier to solve ?
[{
BodyId: 1,
TrID: [{
Id: 1,
TdId: [{
Id: 1,
Name: "Td1"
},
{
Id: 2,
Name: "Td2"
}]
}]
}]

Ok Guys so I have an answer for my own question, just in case if somebody need a tree view for ng-table solution is in here:
Plunker
<tr ng-repeat="user in $data">
<td ng-repeat="column in columns" ng-show="column.visible" sortable="column.field">
<div ng-click="isLevel1Collapsed = !isLevel1Collapsed">
<span ng-class="{'glyphicon glyphicon-plus':isLevel1Collapsed,'glyphicon glyphicon-minus': !isLevel1Collapsed}" ng-if="user.children.length > 0 && column.field === 'name'" ></span>
{{user[column.field]}}
</div>
<div ng-repeat="level1 in user.children">
<div ng-if="column.field === 'name'" collapse="isLevel1Collapsed">
<span style="margin-left: 20px;" ng-class="{'glyphicon glyphicon-plus':isLevel2Collapsed,'glyphicon glyphicon-minus': !isLevel2Collapsed}" ng-click="isLevel2Collapsed = !isLevel2Collapsed">
{{level1.jobTitle}}
</span>
<div collapse="isLevel2Collapsed">
<div ng-repeat="level2 in level1.children" ng-if="column.field === 'name'">
<span style="margin-left: 40px;">{{level2.car}}</span>
</div>
</div>
</div>
</div>
</td>
</tr>
JSON data structure:
[{
name: "Jacob",
age: 27,
children: [{
jobTitle: "Engineer2",
children: [{
car: "bmw1",
year: 2009
},
{
car: "audi",
year: 2010
}]
}]
},
{
name: "Enos",
age: 34,
children: [{
jobTitle: "Cheef",
children: [{
car: "bmw3",
year: 2009
},
{
car: "audi",
year: 2010
}]
}]
},
{
name: "Noea",
age: 43,
children: []
},
{
name: "Jacob",
age: 27,
children: [{
jobTitle: "Fireman",
children: [{
car: "bmw6",
year: 2009
},
{
car: "audi",
year: 2010
}]
}]
},
{
name: "Nephi",
age: 29,
children: [{
jobTitle: "Policeman",
children: [{
car: "bmw7",
year: 2009
},
{
car: "audi",
year: 2010
}]
}]
},
{
name: "Enos",
age: 34,
children: [{
jobTitle: "Bakerman",
children: [{
car: "bmw8",
year: 2009
},
{
car: "audi",
year: 2010
}]
}]
},
{
name: "Enos",
age: 34,
children: [{
jobTitle: "Teacher",
children: [{
car: "bmw11",
year: 2009
},
{
car: "audi",
year: 2010
}]
}]
}];