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 相关文章推荐
Javascript select控件操作大全(新增、修改、删除、选中、清空、判断存在等)
Dec 19 Javascript
使用JavaScript库还是自己写代码?
Jan 28 Javascript
Javascript读取cookie函数代码
Oct 16 Javascript
jquery获取tr中控件值并操作tr实现思路
Mar 27 Javascript
Javascript表单验证要注意的事项
Sep 29 Javascript
精通JavaScript的this关键字
May 28 Javascript
[原创]javascript typeof id==='string'?document.getElementById(id):id解释
Nov 02 Javascript
vue中各组件之间传递数据的方法示例
Jul 27 Javascript
详解vantUI框架在vue项目中的应用踩坑
Dec 06 Javascript
angularjs自定义过滤器demo示例
Aug 24 Javascript
微信小程序onShareTimeline()实现分享朋友圈
Jan 07 Javascript
vue如何实现关闭对话框后刷新列表
Apr 08 Vue.js
详解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 foreach如何跳出两层循环(详解)
2016/11/05 PHP
AJAX的使用方法详解
2017/04/29 PHP
PHP中error_reporting函数用法详细介绍
2017/06/11 PHP
给moz-firefox下添加IE方法和属性
2007/04/10 Javascript
JavaScript之HTMLCollection接口代码
2011/04/27 Javascript
jquery图片延迟加载 前端开发技能必备系列
2012/06/18 Javascript
文本框回车提交与禁止提交示例
2013/09/27 Javascript
AngularJs Managing Service Dependencies详解
2016/09/02 Javascript
原生JS实现的放大镜效果实例代码
2016/10/15 Javascript
AngularJS使用ng-repeat和ng-if实现数据的删选显示效果示例【适用于表单数据的显示】
2016/12/13 Javascript
浅谈js中的变量名和函数名重名
2017/02/13 Javascript
js模态对话框使用方法详解
2017/02/16 Javascript
Node.js中环境变量process.env的一些事详解
2017/10/26 Javascript
JS实现百度网盘任意文件强制下载功能
2018/08/31 Javascript
vue或react项目生产环境去掉console.log的操作
2020/09/02 Javascript
python 多进程通信模块的简单实现
2014/02/20 Python
python基于xmlrpc实现二进制文件传输的方法
2015/06/02 Python
tensorflow: 查看 tensor详细数值方法
2018/06/13 Python
Pandas读取MySQL数据到DataFrame的方法
2018/07/25 Python
Python将一个Excel拆分为多个Excel
2018/11/07 Python
PHP统计代码行数的小代码
2019/09/19 Python
Python3 ID3决策树判断申请贷款是否成功的实现代码
2020/05/21 Python
python 实现简易的记事本
2020/11/30 Python
HTML5边玩边学(2)基础绘图实现方法
2010/09/21 HTML / CSS
Hotels.com爱尔兰:全球酒店预订
2017/02/24 全球购物
德国EGOIST网店:销售畅销的设计师品牌
2017/04/18 全球购物
医学毕业生自荐信
2013/10/11 职场文书
员工培训邀请函
2014/02/02 职场文书
学校欢迎标语
2014/06/18 职场文书
2014年乡镇妇联工作总结
2014/12/02 职场文书
2014年小学体育工作总结
2014/12/11 职场文书
2015年学校工作总结范文
2015/04/20 职场文书
谢师宴家长致辞
2015/07/27 职场文书
2016入党积极分子心得体会
2016/01/06 职场文书
基于Apache Hudi在Google云构建数据湖平台的思路详解
2022/04/07 Servers
彻底卸载VMware虚拟机的超详细步骤记录
2022/07/15 Servers