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

 更新时间:2017年06月03日 16:35:39   作者:群来群往  
本篇文章主要介绍了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>

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

相关文章

  • 详解Angular Karma测试的持续集成实践

    详解Angular Karma测试的持续集成实践

    这篇文章主要介绍了详解Angular Karma测试的持续集成实践,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-11-11
  • 再谈Angular4 脏值检测(性能优化)

    再谈Angular4 脏值检测(性能优化)

    这篇文章主要介绍了再谈Angular4 脏值检测(性能优化),小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-04-04
  • 详解如何在Angular中快速定位DOM元素

    详解如何在Angular中快速定位DOM元素

    本篇文章主要介绍了详解如何在Angular中快速定位DOM元素,非常具有实用价值,需要的朋友可以参考下
    2017-05-05
  • angular.extend方法的具体使用

    angular.extend方法的具体使用

    本篇文章主要介绍了angular.extend方法的具体使用,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-09-09
  • AngularJS 获取ng-repeat动态生成的ng-model值实例详解

    AngularJS 获取ng-repeat动态生成的ng-model值实例详解

    这篇文章主要介绍了AngularJS 获取ng-repeat动态生成的ng-model值实例详解的相关资料,这里提供实例代码及实现效果图,需要的朋友可以参考下
    2016-11-11
  • angular组件间通讯的实现方法示例

    angular组件间通讯的实现方法示例

    这篇文章主要给大家介绍了关于angular组件间通讯的相关资料,文中通过示例代码介绍的非常详细,对大家学习或者使用angular组件具有一定的参考学习价值,需要的朋友们下面来一起学习学习吧
    2020-05-05
  • 详解AngularJS ng-class样式切换

    详解AngularJS ng-class样式切换

    本篇文章主要介绍了详解AngularJS ng-class样式切换,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-06-06
  • AngularJS中实现用户访问的身份认证和表单验证功能

    AngularJS中实现用户访问的身份认证和表单验证功能

    这篇文章主要介绍了AngularJS中实现用户访问的身份认证及表单验证功能的方法,Angular是Google开发的一款浏览器端的高人气JavaScript框架,需要的朋友可以参考下
    2016-04-04
  • Angular模版驱动表单的使用总结

    Angular模版驱动表单的使用总结

    这篇文章主要介绍了Angular模版驱动表单的使用总结,本文实现了Angular支持表单的双向数据绑定,校验,状态管理,非常具有实用价值,需要的朋友可以参考下
    2018-05-05
  • Angular学习笔记之集成三方UI框架、控件的示例

    Angular学习笔记之集成三方UI框架、控件的示例

    这篇文章主要介绍了Angular学习笔记之集成三方UI框架、控件的示例,详细的介绍了Material UI、Ag-grid等框架,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2018-03-03

最新评论