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 相关文章推荐
DIV菜单层实现代码
Nov 19 Javascript
容易被忽略的JS脚本特性
Sep 13 Javascript
js字符串转成JSON
Nov 07 Javascript
利用window.name实现windowStorage代码分享
Jan 02 Javascript
使用javascript实现监控视频播放并打印日志
Jan 05 Javascript
jQuery实现简单二级下拉菜单
Apr 12 Javascript
详解js中class的多种函数封装方法
Jan 03 Javascript
浅谈使用React.setState需要注意的三点
Dec 18 Javascript
node使用Mongoose类库实现简单的增删改查
Nov 08 Javascript
Vue.js 中 axios 跨域访问错误问题及解决方法
Nov 21 Javascript
vuejs2.0运用原生js实现简单拖拽元素功能
Aug 21 Javascript
JavaScript Blob对象原理及用法详解
Oct 14 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
[企业公众号]升级到[企业微信]之后发送消息失败的解决方法
2017/06/30 PHP
PHP编程实现阳历转换为阴历的方法实例
2017/08/08 PHP
tp5修改(实现即点即改)
2019/10/18 PHP
如何将php数组或者对象传递给javascript
2014/03/20 Javascript
js实现页面跳转重定向的几种方式
2014/05/29 Javascript
如何使用PHP+jQuery+MySQL实现异步加载ECharts地图数据(附源码下载)
2016/02/23 Javascript
BootStrap文件上传样式超好看【持续更新】
2016/05/10 Javascript
bootstrap选项卡扩展功能详解
2017/06/14 Javascript
最新Javascript程序员面试试题和解题方法
2017/11/23 Javascript
详解开发react应用最好用的脚手架 create-react-app
2018/04/24 Javascript
Vue开发之封装分页组件与使用示例
2019/04/25 Javascript
[06:40]2014DOTA2西雅图国际邀请赛 DK战队巡礼
2014/07/07 DOTA
[01:10:48]完美世界DOTA2联赛PWL S2 GXR vs PXG 第一场 11.18
2020/11/18 DOTA
Python编程中的文件读写及相关的文件对象方法讲解
2016/01/19 Python
使用Python写一个量化股票提醒系统
2018/08/22 Python
Python如何读取、写入CSV数据
2020/07/28 Python
python3中calendar返回某一时间点实例讲解
2020/11/18 Python
在对linux系统分区进行格式化时需要对磁盘簇(或i节点密度)的大小进行选择,请说明选择的原则
2012/01/13 面试题
优秀经理获奖感言
2014/03/04 职场文书
保护母亲河倡议书
2014/04/14 职场文书
家长会标语
2014/06/24 职场文书
大学同学会活动方案
2014/08/20 职场文书
自愿离婚协议书范本
2014/09/13 职场文书
销售员试用期自我评价
2014/09/15 职场文书
党的群众路线教育实践活动查摆问题及整改措施
2014/10/10 职场文书
学校纪律作风整改措施思想汇报
2014/10/11 职场文书
情人节活动总结范文
2015/02/05 职场文书
2015年暑期社会实践活动总结
2015/03/27 职场文书
跑出一片天观后感
2015/06/08 职场文书
欢迎新生标语2015
2015/07/16 职场文书
2019年汽车租赁合同范本!
2019/08/12 职场文书
八年级作文之感悟亲情
2019/11/20 职场文书
python scrapy简单模拟登录的代码分析
2021/07/21 Python
一篇文章告诉你如何实现Vue前端分页和后端分页
2022/02/18 Vue.js
「SHOW BY ROCK!!」“雫シークレットマインド”组合单曲MV公开
2022/03/21 日漫
CSS中使用grid布局实现一套模板多种布局
2022/07/15 HTML / CSS