ng重复不使用表<tr>但是与列表<李>

ng-repeat not working with table <tr> but works with list <li>

本文关键字:gt lt 列表 tr ng      更新时间:2023-12-03

我有以下代码:Plnkr 上的代码

我正在尝试在表中使用ng-repeat。但这行不通。而相同的代码适用于列表<li>

这里有一个相同的片段。

<h1>Using list</h1>
<ul>
  <li ng-repeat="item in sampleArray">{{item}}</li>
</ul>
<h1>Using Table</h1>
<table>
    <tr ng-repeat="item in sampleArray">{{item}}</tr>
</table>

<tr>中使用ng重复是否不正确。我怎么能正确使用桌子呢。

根据W3C HTML表定义

表是用标记定义的。

使用标记将表划分为表行。

表行通过标记被划分为表数据。

表格行也可以通过标记划分为表格标题。

因此,根本原因是您错过了<tr>元素中的<td><th>元素

<tr ng-repeat="item in sampleArray"><td>{{item}}</td></tr>

使用ng-repeat构建表时,应指定每行单元格的内容,td标记如下:

<table>
  <tr ng-repeat="item in sampleArray">
    <td>{{$index}}</td>
    <td>{{item}}</td>
  </tr>
</table>

是的,检查了plunker,

您需要记住将<td>放入<tr>中。CCD_ 11是显示元件,CCD_。

<tr ng-repeat="item in sampleArray"><td>{{item}}</td></tr>