Josov
10 October 2019 12:20
1
I need a bit advise in order to display a nested table:
I pass the table on to the template node in msg.group_table.
The group_table is an array of objects, each object contains a group_name and an object with a list of devices:
I tried to use the template node to display the table but it does not work. I only get the group_names displayed but the nested device_names do not appear.
<table>
<tr>
<td><B><U>Groep:</U></B></td>
<td><B><U>Naam:</U></B></td>
<td><B><U>Omschrijving:</U></B></td>
<td><B><U>Model:</U></B></td>
<td><B><U>Adres:</U></B></td>
</tr>
<tr ng-repeat="obj in msg.group_table">
<td>{{ obj.group_name }}</td>
<tr ng-repeat="obj in msg.group_table.devices">
<td>{{ obj.device_name }}</td>
<td>{{ obj.omschrijving }}</td>
<td>{{ obj.model }}</td>
<td>{{ obj.address }}</td>
</tr>
</table>
Node-RED v1.0.1
Maybe try changing "obj" in the repeat to "obj2" or something else.
Looking at your msg object, shouldn't devices in the template node be device_list? Also, it's a nested property of the current obj, so I think something like this should work:
<tr ng-repeat="obj in msg.group_table">
<td>{{ obj.group_name }}</td>
<tr ng-repeat="device in obj.device_list">
...
1 Like
Josov
11 October 2019 11:16
4
Yes, you're right concerning devices should be device_list.
It should work. Can you post an example msg? I mean the actual thing, rather than a sceengrab...
Your second repeat uses the wrong object. Make it use obj instead of msg otherwise you won't know which element of the outer array you should be using.
If you had followed my original suggestion, I think you would have spotted that.
1 Like
Josov
13 October 2019 11:13
7
I tried several of your suggestions, they do not make a difference. Nothing from the second iteration is displayed. Only the group_names are listed. It makes no difference if I change "device" in "obj2".
<table>
<tr>
<td><B><U>Groep:</U></B></td>
<td><B><U>Naam:</U></B></td>
<td><B><U>Omschrijving:</U></B></td>
<td><B><U>Model:</U></B></td>
<td><B><U>Adres:</U></B></td>
</tr>
<tr ng-repeat="obj in msg.group_table">
<td>{{ obj.group_name }}</td>
<tr ng-repeat="device in obj.device_list">
<td>{{ device.device_name }}</td>
<td>{{ device.omschrijving }}</td>
<td>{{ device.model }}</td>
<td>{{ device.address }}</td>
</tr>
</table>
When you are moving the data from your group_table variable to a msg, you probably moved it to msg.payload?
In the future, please give people all of the information. A copy of the actual input msg, a copy of the function you are using as well as the template. Otherwise we waste a lot of time and energy.
Given the following data:
[
{
"group_name": "White_Group",
"device_list": [
{
"device_name": "dev1",
"group_name": "White_Group",
"omschrijving": "A device",
"model": "LED123",
"address": "0xAAAAAAA"
},
{
"device_name": "dev2",
"group_name": "White_Group",
"omschrijving": "Another device",
"model": "LED456",
"address": "0xBBBBBB"
}
]
},
{
"group_name": "Green_Group",
"device_list": [
{
"device_name": "dev3",
"group_name": "Green_Group",
"omschrijving": "Device #3",
"model": "LED5678",
"address": "0xCCCCC"
},
{
"device_name": "dev4",
"group_name": "Green_Group",
"omschrijving": "Device #4",
"model": "LED9012",
"address": "0xDDDDDD"
}
]
}
]
And the following template:
<h2>Option 1</h2>
<div ng-repeat="obj in msg.payload">
<h3>{{ obj.group_name }}</h3>
<table><thead>
<tr>
<th>Groep</th>
<th>Naam</th>
<th>Omschrijving</th>
<th>Model</th>
<th>Adres</th>
</tr></thead><tbody>
<tr rowspan="99">
<td>{{ obj.group_name }}</td>
</tr>
<tr ng-repeat="device in obj.device_list">
<td></td>
<td>{{ device.device_name }}</td>
<td>{{ device.omschrijving }}</td>
<td>{{ device.model }}</td>
<td>{{ device.address }}</td>
</tr>
</tbody></table>
</div>
<hr>
<h2>Option 2</h2>
<div>
<table><thead>
<tr>
<th>Groep</th>
<th>Naam</th>
<th>Omschrijving</th>
<th>Model</th>
<th>Adres</th>
</tr></thead><tbody>
<tr ng-repeat-start="obj in msg.payload">
<td colspan="4">{{ obj.group_name }}</td>
</tr>
<tr ng-repeat="device in obj.device_list">
<td> </td>
<td>{{ device.device_name }}</td>
<td>{{ device.omschrijving }}</td>
<td>{{ device.model }}</td>
<td>{{ device.address }}</td>
</tr>
<tr ng-repeat-end>
<td colspan="4"> </td>
</tr>
</tbody></table>
</div>
You will get the following output:
And a possible better version as another alternative:
<h2>Option 3</h2>
<div>
<table><thead>
<tr>
<th>Groep</th>
<th>Naam</th>
<th>Omschrijving</th>
<th>Model</th>
<th>Adres</th>
</tr></thead>
<tbody ng-repeat="obj in msg.payload">
<tr >
<td colspan="4">{{ obj.group_name }}</td>
</tr>
<tr ng-repeat="device in obj.device_list">
<td> </td>
<td>{{ device.device_name }}</td>
<td>{{ device.omschrijving }}</td>
<td>{{ device.model }}</td>
<td>{{ device.address }}</td>
</tr>
</tbody>
</table>
</div>
I had to look up whether you were allowed multiple tbody tags in a table and you are.
Josov
13 October 2019 14:46
11
The data was moved to msg.group_table....
Josov
13 October 2019 14:46
12
Your options do work great, thank you so much!!!
