angular ng-repeat数组中的数组实例


Posted in Javascript onFebruary 18, 2017

//先定义一个数组

anular代码:

var app = angular.module('serApp', []); 

app.controller('indexCtrl', function($scope, $http) 
{ $scope.arrs = [{

<BR>







 n:'a'; 
        arr:['1','2','1'] 
      },{<BR><BR> 








 n:'b'; 
        arr:['4','5','6'] 
      }]; 
    })

html 代码:

<BR>

<div ng-controller="indexCtrl"><BR>      
<p>{{name}}</p><BR>      

<ul><BR>        
 <li ng-repeat="name in names">{{name.n}}<BR>          
 <p ng-repeat="a in name.arr track by $index" id="{{$index}}">{{a}}</p><BR>        
 </li><BR>      
</ul>
<BR>    
</div><BR><BR>

track by $index  在有重复值时需加上这段代码 不然浏览器会报这个错 Error: [ngRepeat:dupes]并且不会渲染到页面

以上这篇angular ng-repeat数组中的数组实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Javascript与flash交互通信基础教程
Aug 07 Javascript
div移动 输入框不能输入的问题
Nov 19 Javascript
js调用百度地图及调用百度地图的搜索功能
Sep 07 Javascript
JavaScript 闭包机制详解及实例代码
Oct 10 Javascript
JS实现超简单的汉字转拼音功能示例
Dec 22 Javascript
js 性能优化之算法和流程控制
Feb 15 Javascript
VUE 3D轮播图封装实现方法
Jul 03 Javascript
mac上配置Android环境变量的方法
Jul 08 Javascript
JavaScript循环遍历你会用哪些之小结篇
Sep 28 Javascript
使用webpack编译es6代码的方法步骤
Apr 28 Javascript
layui.use模块外部使用其内部定义的js封装函数方法
Sep 16 Javascript
解决echarts vue数据更新,视图不更新问题(echarts嵌在vue弹框中)
Jul 20 Javascript
js Canvas绘制圆形时钟效果
Feb 17 #Javascript
Bootstrap风格的zTree右键菜单
Feb 17 #Javascript
js仿新浪微博消息发布功能
Feb 17 #Javascript
babel基本使用详解
Feb 17 #Javascript
JS及JQuery对Html内容编码,Html转义
Feb 17 #Javascript
canvas 实现中国象棋
Feb 17 #Javascript
使用vue.js实现checkbox的全选和多个的删除功能
Feb 17 #Javascript
You might like
php多层数组与对象的转换实例代码
2013/08/05 PHP
php实现可以设置中奖概率的抽奖程序代码分享
2014/01/19 PHP
PHP中应该避免使用同名变量(拆分临时变量)
2015/04/03 PHP
Fleaphp常见函数功能与用法示例
2016/11/15 PHP
JQuery 遮罩层实现(mask)实现代码
2010/01/09 Javascript
JQuery 技巧和窍门整理(8个)
2010/04/22 Javascript
js汉字转拼音实现代码
2013/02/06 Javascript
Knockout visible绑定使用方法
2013/11/15 Javascript
浅谈JavaScript Array对象
2014/12/29 Javascript
Jquery实现遮罩层的方法
2015/06/08 Javascript
jQuery实现点击后标记当前菜单位置(背景高亮菜单)效果
2015/08/22 Javascript
JS与jQ读取xml文件的方法
2015/12/08 Javascript
实例解析jQuery中proxy()函数的用法
2016/05/24 Javascript
Angularjs在初始化未完毕时出现闪烁问题的解决方法分析
2016/08/05 Javascript
javascript 内置对象及常见API详细介绍
2016/11/01 Javascript
利用Javascript开发一个二维周视图日历
2017/12/14 Javascript
vue 组件 全局注册和局部注册的实现
2018/02/28 Javascript
js canvas实现二维码和图片合成的海报
2020/11/19 Javascript
JavaScript中.min.js和.js文件的区别讲解
2019/02/13 Javascript
JavaScript实现省市联动效果
2019/11/22 Javascript
d3.js 地铁轨道交通项目实战
2019/11/27 Javascript
js实现弹窗效果
2020/08/09 Javascript
Python列表list数组array用法实例解析
2014/10/28 Python
Python字符编码判断方法分析
2016/07/01 Python
关于python的list相关知识(推荐)
2017/08/30 Python
将python安装信息加入注册表的示例
2019/11/20 Python
Python虚拟环境库virtualenvwrapper安装及使用
2020/06/17 Python
Python如何对XML 解析
2020/06/28 Python
使用 css3 实现圆形进度条的示例
2017/07/05 HTML / CSS
中国首家奢侈品O2O网购平台:第五大道奢侈品网
2017/12/14 全球购物
马德里运动鞋商店:Nigra Mercato
2020/02/16 全球购物
年度考核自我评价
2014/01/25 职场文书
总经理岗位职责描述
2014/02/08 职场文书
应届生个人的求职(自荐信范文2篇)
2019/08/23 职场文书
你喜欢篮球吗?Python实现篮球游戏
2021/06/11 Python
python基础之模块的导入
2021/10/24 Python