如何在angularjs中创建一个完整的html表

How do you create a complete html table in angularjs?

本文关键字：一个 html angularjs 创建      更新时间：2023-09-26

我有需要加载到html页面中的数据。

我使用angularjs来填充每个表格。现在总共有8张桌子。

我想重写一下，这样表计数就可以完全动态了。

这意味着对每个表进行某种for循环，然后在js中构建整个表。html页面本身只会显示对角度控制器的基本调用。

我已经看到了大量关于如何使用angularjs动态构建表行的示例。这是个老消息。

有没有可能从标记到构建一个完整的表，这样我就可以创建嵌套在一个大表中的多个表？

像这样的东西？

<table>
for( i = 0; i < tablesCollection.length;i++ )
{
paintTable( i );
}
</table>

结果如下（四个表嵌套在一个两列两行的主表中？

<table>
<tr>
<td>
<table id=table01>
<tr>
<td>
</td>
</tr>
</table>
<td>
<table id=table02>
<tr>
<td>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<table id=table03>
<tr>
<td>
</td>
</tr>
</table>
<td>
<table id=table04>
<tr>
<td>
</td>
</tr>
</table>
</td>
</tr>
</table>

我认为使用数据表可以解决您的问题。它很容易使用。

Html:

<div id="data-table"></div>

初始化可以动态完成，这意味着您可以使用动态数据创建表（通过json循环）。也许这可以解决"将表合并为一个"的问题。一个简单（静态）的例子：

var table = $('#data-table').DataTable({
    {'sTitle': 'First Name', 'mData': 'first_name'},
    {'sTitle': 'Last Name', 'mData': 'last_name'},
    {'sTitle': 'Address', 'mData': 'address'},
});

这将创建一个包含"名字"、"姓氏"answers"地址"列的表。

用数据更新表格：

table.row.add(data);

它非常易于使用，文档非常好，有很多可能性，并且可以重用很多代码。

相关文章：