angularJS利用ng-repeat遍历二维数组的实例代码


Posted in Javascript onJune 03, 2017

最近在做报表的项目,有一种情况是后台返回给我的是一个二维数组,在前台将数据放入到表格中,因为我们用的是AngularJS的前台框架,所以利用ng-repeat来实现:

首先在js中:

$scope.Week = [[ '云南省 ', 'a', 's', 'd', 'e', 'w','t' ],[ '陕西省 ', 'l', 'p', 'o', 'i', 'u','y' ],[ '青海省 ', 1, 2, 4, 4, 5, 6 ] ];

在HTML中:

样式一:

<ul ng-repeat="a in Week">
<ul ng-repeat="b in a track by $index">
<li><b style="color: green">{{b}}</b></li>
</ul>
</ul>

样式二:

<table style="border:solid 1px">
<tr ng-repeat="a in Week" style="border:solid 1px">
<td ng-repeat="b in a track by $index" style="border:solid 1px">
<b style="color: green">{{b}}</td>
</tr>
</table>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
动态刷新 dorado树的js代码
Jun 12 Javascript
Jquery颜色选择器ColorPicker实现代码
Nov 14 Javascript
判断js对象是否拥有某一个属性的js代码
Aug 16 Javascript
php析构函数的具体用法小结
Mar 11 Javascript
JavaScript获取文本框内选中文本的方法
Feb 20 Javascript
jQuery插件jcrop+Fileapi完美实现图片上传+裁剪+预览的代码分享
Apr 22 Javascript
JavaScript 中有关数组对象的方法(详解)
Aug 15 Javascript
使用JavaScript判断用户输入的是否为正整数(两种方法)
Feb 05 Javascript
jquery hover 不停闪动问题的解决方法(亦为stop()的使用)
Feb 10 Javascript
微信小程序实现多个按钮toggle功能的实例
Jun 13 Javascript
vue页面离开后执行函数的实例
Mar 13 Javascript
JavaScript实现的反序列化json字符串操作示例
Jul 18 Javascript
详解JavaScript调用栈、尾递归和手动优化
Jun 03 #Javascript
详解有关easyUI的拖动操作中droppable,draggable用法例子
Jun 03 #Javascript
利用vueJs实现图片轮播实例代码
Jun 03 #Javascript
angular中使用Socket.io实例代码
Jun 03 #Javascript
jquery请求servlet实现ajax异步请求的示例
Jun 03 #jQuery
深入理解Node中的buffer模块
Jun 03 #Javascript
MvcPager分页控件 适用于Bootstrap
Jun 03 #Javascript
You might like
浅析php插件 Simple HTML DOM 用DOM方式处理HTML
2013/07/01 PHP
php 强制下载文件实现代码
2013/10/28 PHP
codeigniter教程之多文件上传使用示例
2014/02/11 PHP
设置php页面编码的两种方法示例介绍
2014/03/03 PHP
JavaScript 语法集锦 脚本之家基础推荐
2009/11/15 Javascript
js RuntimeObject() 获取ie里面自定义函数或者属性的集合
2010/11/23 Javascript
myFocus slide3D v1.1.0 使用方法与下载
2011/01/12 Javascript
jQuery cdn使用介绍
2013/05/08 Javascript
24款热门实用的jQuery插件推荐
2014/12/24 Javascript
深入理解bootstrap框架之第二章整体架构
2016/10/09 Javascript
详解jquery validate实现表单验证 (正则表达式)
2017/01/18 Javascript
在js中做数字字符串补0(js补零)
2017/03/25 Javascript
iOS + node.js使用Socket.IO框架进行实时通信示例
2017/04/14 Javascript
JS实现将二维数组转为json格式字符串操作示例
2018/07/12 Javascript
Vue 嵌套路由使用总结(推荐)
2020/01/13 Javascript
vue-autoui自匹配webapi的UI控件的实现
2020/03/20 Javascript
jQuery 实现扁平式小清新导航
2020/07/07 jQuery
js实现查询商品案例
2020/07/22 Javascript
jQuery实现电梯导航模块
2020/12/22 jQuery
[51:53]完美世界DOTA2联赛决赛日 Inki vs LBZS 第二场 11.08
2020/11/10 DOTA
Python语言的面相对象编程方式初步学习
2016/03/12 Python
python机器学习理论与实战(一)K近邻法
2021/01/28 Python
用Python实现读写锁的示例代码
2018/11/05 Python
python的debug实用工具 pdb详解
2019/07/12 Python
python zip()函数使用方法解析
2019/10/31 Python
python框架django项目部署相关知识详解
2019/11/04 Python
Python 简单计算要求形状面积的实例
2020/01/18 Python
使用卷积神经网络(CNN)做人脸识别的示例代码
2020/03/27 Python
详解python的变量缓存机制
2021/01/24 Python
StubHub澳大利亚:购买或出售您的门票
2019/08/01 全球购物
商务日语毕业生自荐信范文
2013/11/14 职场文书
护士检查书
2014/01/17 职场文书
廉洁教育学习材料
2014/05/19 职场文书
年底个人总结范文
2015/03/10 职场文书
银行催款通知书
2015/04/17 职场文书
Python使用Web框架Flask开发项目
2022/06/01 Python