在一个项目中,需要嵌套循环输出一个二维表的里的数据

数据结构

[
{
id:1,
list:[
{
id:1,
name:'li'
}
]
},
{
id:2,
list:[
{
id:1,
name:'ming'
}
]
}
]

模板页

<div ng-repeat="c in obj">
<div ng-repeat="a in c.list">
<span ng-if="$first">
{{$parent.$index}}
</span>
</div>
</div>

因为需要访问到父作用域里的索引值,可以通过$parent来获取对父作用域的引用

但是每次取到的值都是一样的,纠结了一会才想起来我添加了一个ng-if动态插入DOM节点。ng-if会动态的插入和删除DOM,那么就会创建一个新的作用域,$parent.$index实际山访问到的就是第二层ng-repeat的$index变量;

ng-if 和ng-repeat都是动态的添加或删除DOM(基于这点,就不需要记住所有的能创建作用域的指令;还有directive, ng-controller),所以会创建新的作用域,和指令一样;

所以像我前面的代码,要想访问到第一级ng-repeat里的$index,就需要在往上访问一级

{{$parent.$parent.$index}}

虽然可以访问的到,但是如果层级改变,我们就需要重新调整,增加或删除$parent,看起来好像很不友好。

ng-repeat 嵌套访问父作用域里的属性的更多相关文章

  1. iframe里访问父级里的方法属性

    window.parent.attributeName;  // 访问属性attributeName是在父级窗口的属性名 window.parent.Func();  // 访问属性Func()是在父 ...

  2. JsRender实用教程(tag else使用、循环嵌套访问父级数据)

    前言 JsRender是一款基于jQuery的JavaScript模版引擎,它具有如下特点: ·  简单直观 ·  功能强大 ·  可扩展的 ·  快如闪电 这些特性看起来很厉害,但几乎每个模版引擎, ...

  3. angularjs 嵌套控制器,子控制器访问父控制器

    <pre> http://www.lovelucy.info/understanding-scopes-in-angularjs.html http://blog.csdn.net/jfk ...

  4. 在iframe里调用parent.func()引出的js函数运行在它们被定义的作用域里,而不是它们被执行的作用域里

    有个document里定义了一个函数func(),同时在document里嵌入了一个iframe,在这个iframe里调用父窗口的方法:parent.func(),本来我以为这个函数的运行环境是在这个 ...

  5. html 事件处理程序中的代码在执行时,有权访问全局作用域中的任何代码。

    看一个简单的例子: html: <head> <meta charset="UTF-8"> <title>Document</title& ...

  6. JavaScript从父页面获取子页面的值(子页面又如何访问父页面)

    之前还真没做过类似的东西,,top页面获取子页面的document.. 在百度搜了下即找到这个东东,还好,能用. 主要就是使用 contentWindow方法,获取子页面的所有document,再做处 ...

  7. Handlebars.js循环中索引(@index)使用技巧(访问父级索引)

    使用Handlebars.js过程中,难免会使用循环,比如构造数据表格.而使用循环,又经常会用到索引,也就是获取当前循环到第几次了,一般会以这个为序号显示在页面上. Handlebars.js中获取循 ...

  8. jsrender-for循环中访问父属性

    jsrender中使用for循环数据时有时需要访问父级数据. 而jsrender在循环中的父级数据存放在隐藏属性parent.parent.data中,使用案例如下 {{:#parent.parent ...

  9. php学习笔记:foreach循环访问关联数组里的值

    foreach循环可以将数组里的所有值都访问到,下面我们展示下,用foreach循环访问关联数组里的值. 例如: $fruit=array('apple'=>"苹果",'ba ...

随机推荐

  1. [LeetCode] Power of Three 判断3的次方数

    Given an integer, write a function to determine if it is a power of three. Follow up:Could you do it ...

  2. NPOI操作EXCEL(三)——反射机制进行excel表格数据的解析

    我们先来回忆回忆上篇文章讲到的通过xml配置文件实现excel批量模板解析的整体思路: 1.对每个excel模板制定xml配置规则集,实现xml配置文件的解析服务 2.为每个excel模板制定DTO, ...

  3. laravel实现数据库多库配置,读写分离配置或者多读写分离配置

    'connections' => array( //默认mysql配置,访问test库 'mysql' => array( 'driver' => 'mysql', 'host' = ...

  4. telent对端口检测状态分析

    telnet基于TCP/IP协议通信的,把远程的shell反弹回本地! yum install -y telnet apt-get  install telnet ###端口被封,有墙堵住 [root ...

  5. android studio 集成微信登录

    参考: 1.http://blog.csdn.net/suma_sun/article/details/50752528 2.这个更全面一点 : http://www.jb51.net/article ...

  6. 页置换算法FIFO、LRU、OPT

    页置换算法FIFO.LRU.OPT 为什么需要页置换 在地址映射过程中,若在页面中发现所要访问的页面不再内存中,则产生缺页中断.当发生缺页中断时操作系统必须在内存选择一个页面将其移出内存,以便为即将调 ...

  7. 玩转Redis之Window安装使用(干货)

    距离上次定Gc.Db框架,好久没有更新博客了,今日没什么事,就打算就Redis写点东西. Redis是一个开源(BSD许可),内存存储的数据结构服务器,可用作数据库,高速缓存和消息队列代理.它支持字符 ...

  8. cocos2d-x 帧动画

    ani = cc.Animation:create(); ...... local animate = cc.Animate:create(ani); s:runAction(animate); 发现 ...

  9. (转)git常见错误

    如果输入$ Git remote add origin git@github.com:djqiang(github帐号名)/gitdemo(项目名).git 提示出错信息:fatal: remote ...

  10. java网络编程精解demo1---读取用户控制台的输入的数据并显示

    package test3; import java.io.BufferedReader; import java.io.IOException; import java.io.InputStream ...