Angularjs Angular JS:ng repeat不在表标记内呈现

以下代码段仅显示“我的页面”中的

thead

：

<table>
    <thead>
        <tr id="table-heading">
            <th>Team</th>
            <th>Played</th>
            <th>Won</th>
            <th>Drawn</th>
            <th>Lost</th>
            <th>Points</th>
        </tr>
    </thead>
    <tbody>
        <div ng-repeat="(tableKey, tableRow) in tableObject.table">
            <tr id="table-body">
                <td>{{tableKey}}</td>
                <td>{{tableRow.gamesPlayed}}</td>
                <td>{{tableRow.gamesWon}}</td>
                <td>{{tableRow.gamesDrawn}}</td>
                <td>{{tableRow.gamesLost}}</td>
                <td>{{tableRow.gamesPoints}}</td>
            </tr>
        </div>
    </tbody>
</table>

团队
玩
赢了
绘制
迷路的
要点
{{tableKey}}
{{tableRow.gamesPlayed}
{{tableRow.gamesWon}
{{tableRow.gamesDrawn}
{{tableRow.gamesLost}
{{tableRow.gamesPoints}

但是，如果我要注释掉

table

标记和

thead

元素，并保留

tbody

，则表体显示良好

我在这里遗漏了哪些关于表格的概念？

<table>
    <thead>
        <tr id="table-heading">
            <th>Team</th>
            <th>Played</th>
            <th>Won</th>
            <th>Drawn</th>
            <th>Lost</th>
            <th>Points</th>
        </tr>
    </thead>
    <tbody>
        <tr ng-repeat="(tableKey, tableRow) in tableObject.table">
            <td>{{tableKey}}</td>
            <td>{{tableRow.gamesPlayed}}</td>
            <td>{{tableRow.gamesWon}}</td>
            <td>{{tableRow.gamesDrawn}}</td>
            <td>{{tableRow.gamesLost}}</td>
            <td>{{tableRow.gamesPoints}}</td>
        </tr>
    </tbody>
</table>

团队
玩
赢了
绘制
迷路的
要点
{{tableKey}}
{{tableRow.gamesPlayed}
{{tableRow.gamesWon}
{{tableRow.gamesDrawn}
{{tableRow.gamesLost}
{{tableRow.gamesPoints}

---

id=“table body”

也被删除，因为我们在页面上不能有相同的id。

这里不需要

div

，如果您想为每一行设置id，可以使用指令

因此，您的

将

<tbody>
    <tr ng-attr-id = "{{ 'tablebodyObj_' + tableRow.index }}" 
        ng-repeat = "(tableKey, tableRow) in tableObject.table">
        <td>{{tableKey}}</td>
        <td>{{tableRow.gamesPlayed}}</td>
        <td>{{tableRow.gamesWon}}</td>
        <td>{{tableRow.gamesDrawn}}</td>
        <td>{{tableRow.gamesLost}}</td>
        <td>{{tableRow.gamesPoints}}</td>
    </tr>
</tbody>

{{tableKey}}
{{tableRow.gamesPlayed}
{{tableRow.gamesWon}
{{tableRow.gamesDrawn}
{{tableRow.gamesLost}
{{tableRow.gamesPoints}

如果是有效的HTML，可能通过验证器运行它，我怀疑tbody中的DIV无效。如果您愿意，您可以将ng repeat直接放在tr上。是的，您是对的，将ng repeat移动到tr解决了这个问题，请参见下面的答案。我相信这不会呈现，因为这是破坏的html，在tbody下，您应该立即有一个表标记tr。页面上相同的id是什么意思？“id属性为html元素指定了唯一的id（该值在HTML文档中必须是唯一的）。id属性最常用于指向样式表中的样式，并由JavaScript（通过HTML DOM）使用特定id操纵元素。“