如何利用AngularJS动态创建表格和动态赋值

JavaScript09

如何利用AngularJS动态创建表格和动态赋值,第1张

第一步,打开HBuilder开发工具,在指定的Web项目中新建静态页面init.html,并引入Bootstrap和AngularJS相关的文件

第二步,在body元素添加ng-controller指令,并在里面添加<table></table>

第三步,在<script></script>里编写AngularJS初始化函数,并声明控制器

第四步,预览该静态页面,在浏览器查看页面效果,显示一个输入框和按钮

第五步,在控制器中添加变量model,这个变量赋值数组

第六步,在表格table循环model变量,遍历该数组并给表格赋值

注意事项

注意AngularJS动态获取表格数据

注意AngularJS动态赋值

给你说下思路,

document.getElementById("top").rows.length可以获得top表的行数

document.getElementById("top").rows[0].cells.length可以获得top表的第一行的列数

document.getElementById("top").rows[0].cells[0].offsetWidth可获得top表第一行第一列的实际宽度,(注意,这个是只读的!)

所以

for(var i=0i<document.getElementById("top").rows[0].cells.lengthi++)

{

document.getElementById("buttom").rows[0].cells[i].width=document.getElementById("top").rows[0].cells[i].offsetWidth

}

希望对你有帮助!