有条件地在 HTML 表格中插入一行Angular

问题描述

问题

如何使用 Angular 有条件地在 HTML 表格中插入一行？

关于问题的更多细节

我正在 Node-RED 中使用 Angular，这是我的表格，它遍历对象中的每个键/值：

<table>
    <tr>
        <td>ID</td>
        <td>State</td>
        <td>Data</td>
    </tr>
    <tr ng-repeat="(key,value) in msg.shellies">
        <td>{{key}}</td>
        <td>{{value.up_since_time}} {{value.up_since_date}})</td>
        <td>{{value.data}}</td>
    </tr>
</table>

我知道如何有条件地添加任何元素，例如<span> 像这样：

<span ng-if="value.state === 'up'">The device is UP</span>

但显然我不能将表格行包装在 <span> 中（HTML 不会验证），我希望 ng-repeat 应用于表格行。

初步想法

我最初的想法是浏览器会忽略某些 HTML 元素，我可以将 ng-repeat 应用于该元素，将 ng-if 应用于表格行。例如

<magic_invisible_tag ng-repeat="(key,value) in msg.shellies">
    <tr ng-if="value.state === 'up'">
        <td>.....</td>
    </tr>
</magic_invisible_tag>

但这显然不可能在 Stack Overflow 上阅读 various questions。

在 Angular 中是否有其他一些表示法适用于此？

解决方法

尝试过这个之后，似乎可以将 ng-if 指令添加到表格行本身。

我猜 Angular 已经做了工作，以某种方式确保 ng-repeat 指令有效，而不管同一元素中的 ng-if 指令如何。

html node-red