交流群:462197261站长百科站长论坛热门标签收藏本站北冥有鱼 互联网前沿资源第一站 助力全行业互联网+
点击这里给我发消息
  • 当前位置:
  • angularJS利用ng-repeat遍历二维数组的实例代码

    最近在做报表的项目,有一种情况是后台返回给我的是一个二维数组,在前台将数据放入到表格中,因为我们用的是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>

    以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持北冥有鱼。

    您可能感兴趣的文章:

    • AngularJS ng-repeat遍历输出的用法
    • AngularJS ng-repeat指令中使用track by子语句解决重复数据遍历错误问题
    • Angular ng-repeat遍历渲染完页面后执行其他操作详细介绍
    • Angular ng-repeat 对象和数组遍历实例
    • AngularJS遍历获取数组元素的方法示例
    • angular ng-repeat数组中的数组实例
    • AngularJS ng-repeat数组有重复值的解决方法
    • AngularJS中比较两个数组是否相同
    • AngularJS使用ng-repeat遍历二维数组元素的方法详解

    广而告之:
    热门推荐:
    ASP.NET中的Menu控件的应用及XmlDataSource的了解

    以前一直以为菜单都是通过sitemap制作的,最近看到项目中的方法是使用XmlDataSource榜定的。 Menusite.xlm文件: 复制代码 代码如下: <?xmlversion="1.0"encoding="utf-8"?> <Menusvalue=""> <TopMenuid="100"value=""ImageUrl="~/App_Themes/Public/imag···

    判断脚本加载是否完成的方法

    我们可以对加载的 JS 对象使用 onload 来判断(js.onload),此方法 Firefox2、Firefox3、Safari3.1+、Opera9.6+ 浏览器都能很好的支持,但 IE6、IE7 却不支持。曲线救国 —— IE6、IE7 我们可以使用 js.onreadystatechange 来跟踪每个状态变化的情况(一般为 loading 、lo···

    友情链接对网站没起到优化作用?解锁多样化友情链接欺骗方式

    在谈到友情链接之前,先谈到了外链的作用。友情链接属于高质量的链接,站长们也更加关注它们。因此,一些人开始用歪心眼来欺骗友谊。友谊链是建立在相互信任和互利的基础上的。那些利用欺骗手段单方获利的人是可恶的。今天的文章是关于友情链中各种欺骗方式的。首先,分享这个···

    webpack打包非模块化js的方法

    本文主要记录了非模块化js如何使用webpack打包 模块化打包实现方式 webpack是模块打包工具,通过入口文件递归遍历其依赖图谱,绝对是打包神器。 bar.js export default function bar() { // } foo.js import bar from './bar'; bar(); 通过如下,webpack配置很快实现打包···

    HTML5 播放 RTSP 视频的实例代码

    目前大多数网络摄像头都是通过 RTSP 协议传输视频流的,但是 HTML 并不标准支持 RTSP 流。除了 Firefox 浏览器可以直接播放 RTSP 流之外,几乎没有其他浏览器可以直接播放 RTSP 流。Electron 应用是基于 Chromium 内核的,因此也不能直接播放 RTSP 流。 在借助一定工具的情况下···

    js正则表达式基本语法(精粹)

    (推荐)JS正则知识点专题://www.jb51.net/article/139831.htm 1.正则表达式基本语法 两个特殊的符号'^'和'$'。他们的作用是分别指出一个字符串的开始和结束。 例子如下: "^The":表示所有以"The"开始的字符串("There","The cat"等); "of despair$":表示所以以"of despa···

    C++实现双向冒泡排序算法

    本文实例为大家分享了C++实现双向冒泡排序算法的具体代码,供大家参考,具体内容如下 一、概念(来源于百度百科) 传统冒泡算法原理 冒泡排序算法的运作如下:(从后往前) 1.比较相邻的元素。如果第一个比第二个大,就交换他们两个。 2.对每一对相邻元素作同样的工作,从开始···

    JS正则表达式匹配检测各种数值类型(数字验证)

    验证数字的正则表达式集 验证数字:^[0-9]*$ 验证n位的数字:^\d{n}$ 验证至少n位数字:^\d{n,}$ 验证m-n位的数字:^\d{m,n}$ 验证零和非零开头的数字:^(0|[1-9][0-9]*)$ 验证有两位小数的正实数:^[0-9]+(.[0-9]{2})?$ 验证有1-3位小数的正实数:^[0-9]+(.[0-9]{···

    jquery 淡入淡出效果的简单实现

    样式:复制代码 代码如下: <style type="text/css">      #win {              width: 98%;             po···

    PHP输出缓冲控制Output Control系列函数详解

    概述 以前研究过PHP的输入输出缓冲,不过博客搬家以后,原来文章找不到了,今天看到一篇好文,顺便转载过来。 简介 说到输出缓冲,首先要说的是一个叫做缓冲器(buffer)的东西。举个简单的例子说明他的作用:我们在编辑一篇文档时,在我们没有保存之前,系统是不会向磁盘写入的···