使用angular ng repeat从对象动态创建HTML表行

FWIW HTML角度代码正在“模板”节点的节点红色中使用

我有一个由序列号标识的电路板组成的对象。每个电路板有两个通道，每个通道都有各自的输出

这些数字可能会改变，例如，将来某些电路板将有更多通道，或者我将向系统添加另一个电路板。因此，我需要使用嵌套循环创建表，以遍历消息对象并提取当时存在的任何信息

我成功地使用ng repeat通过ng在每个电路板的通道上重复来为每个电路板构建单独的表。但我更希望每个通道都有一个每个电路板的主表，这样我就可以根据设定值的状态对该表进行排序

这是我的目标：

{ "serialNum": {
    "1a": {
            "channel": {
                "0": {
                    "status": "running",
                    "value" : 100.0,
                    "setpoint": 200.0
                },
                "1": {
                    "status": "running",
                    "value" : 100.1,
                    "setpoint": 200.1
                }
            }
        },
    "2a": {
            "channel": {
                "0": {
                    "status": "running",
                    "value" : 200.0,
                    "setpoint": 300.0
                },
                "1": {
                    "status": "running",
                    "value" : 200.1,
                    "setpoint": 300.1
                }
            }
        },
    "3a": {
            "channel": {
                "0": {
                    "status": "stopped",
                    "value" : 300.0,
                    "setpoint": 400.0
                },
                "1": {
                    "status": "stopped",
                    "value" : 300.1,
                    "setpoint": 400.1
                }
            }
        }
    }
}

下面是我目前正在尝试的代码（我猜我在这里做了很多错事……）：

表，th，td{
边框：1px纯灰；
边界塌陷：塌陷；
填充物：5px；
}
表tr：第n个子项（奇数）{
背景色：#f1f1；
}
表tr：第n个子项（偶数）{
背景色：#ffffff；
}
连载#
渠道#
地位
价值
设定点
{{serial}}
{{channelNum}}
{{msg.boardMsg.serialNum[serial].channel[channelNum].status==“已停止”？“已停止”：“正在运行”}
{{msg.boardMsg.serialNum[serial].channel[channelNum].value
{{msg.boardMsg.serialNum[serial].channel[channelNum].setpoint

我希望桌子看起来像这样：

到目前为止，我的代码只提供标题。提前感谢您的帮助！

使用

ng repeat

指令的

（键，值）

形式：

<tbody ng-repeat="(serialNum, serialVal) in msg.boardMsg.serialNum">
    <tr ng-repeat="(channelNum, channelVal) in serialVal.channel">
        <td> {{serialNum}} </td>
        <td>{{channelNum}}</td>
        <td ng-style = "{color : channelVal.status === 'stopped' ? 'red' : 'green'}">
          {{channelVal.status == "stopped" ? "stopped" : "running"}}
        </td>  
        <td>{{channelVal.value}}</td>
        <td>{{channelVal.setpoint}}</td>
    </tr>
</tbody>

{{serialNum}}
{{channelNum}}
{{channelVal.status==“已停止”？“已停止”：“正在运行”}
{{channelVal.value}
{{channelVal.settpoint}

有关详细信息，请参阅

---

谢谢，这绝对有效！但有一个问题是

<tbody ng-repeat="(serialNum, serialVal) in msg.boardMsg.serialNum">
    <tr ng-repeat="(channelNum, channelVal) in serialVal.channel">
        <td> {{serialNum}} </td>
        <td>{{channelNum}}</td>
        <td ng-style = "{color : channelVal.status === 'stopped' ? 'red' : 'green'}">
          {{channelVal.status == "stopped" ? "stopped" : "running"}}
        </td>  
        <td>{{channelVal.value}}</td>
        <td>{{channelVal.setpoint}}</td>
    </tr>
</tbody>