嵌套ng重复,外部ng重复项影响内部ng重复逻辑
nested ng-repeat with outer ng-repeat item affecting the inner ng-repeat logic
我的代码
<div ng-repeat='n in [] | range:(my_works.items.length/3)+1'>
<div class="table-row" style="position:absolute;left:13px;{{row_gap_style(n)}}" class='ng-scope'>
<div class="book_container" ng-repeat='item in my_works.items.slice($index*3,($index*3+3))' style="position:absolute;top:0px;{{col_gap_style($index)}}">
<div id="" title="{{ item.Story.title}}" class="cover_container fetched {{check_published(item)}}" rel="<?php echo $rel; ?>">
我想做的是
如果外部ng重复中的n
为0,那么div.book_container将改为如下所示:
<div class="book_container" ng-show="n == 0" ng-repeat='item in my_works.items.slice($index*2, ($index*2+2))' style="position:absolute;top:0px;{{col_gap_style($index+1)}}">
否则,div应该和以前一样。
我该如何做到这一点?
您可以为相同的内容创建一个指令,然后使用ng-if根据n:的值设置不同的属性
.directive('bookContainer', function() {
return {
scope: {
'items': '=',
'colstyle': '@'
},
restrict: 'E',
template: '<p ng-repeat="item in items">book: {{item}} {{colstyle}}</p>'
};
});
视图:
<div ng-repeat='n in []'>
<book-container ng-if='n==0' items='my_works.slice($index,1)' colstyle='s1'></book-container>
<book-container ng-if='n!=0' items='my_works.slice($index,2)' colstyle='s2'></book-container>
</div>
Fiddle
这个演示已经大大简化了,但展示了您希望使用的技术。
相关文章:
- ng点击ag网格标题模板内部
- 使用ng-src增强对象内部的数组
- 有角度的ng点击ng的内部重复总是得到相同的对象
- 对象内部数组中的角度 ng 重复键
- ng单击从内部数组中删除项
- 为什么更改范围获胜'不能在ng if内部工作,而是通过函数调用AngularJS
- 从ng重复奇数内部的ng点击访问事件对象
- 控制器内部的scope函数不根据视图中的ng模型更新值
- Angular isState-如何在ng if内部进行比较
- 为什么我的表单没有'它不起作用's在ng的内部重复
- UL(在 P 内部)内的 ng 重复不起作用
- 在 ng 选项之后完成控制器内部的回调函数
- 过滤器性能与 ng 重复与多个 ng 显示内部
- ng-if 只删除我表中的内部 HTML
- 访问内部 ng 重复对象以适合表格
- 在嵌套数组内部和从嵌套数组推送和读取,然后 ng 重复它们
- 角度 ng 重复内部指令视图
- 在嵌套的 ng 重复的内部循环中排序
- 角度ng-repeat不更新,当使用jQuery内部指令调用Angular 方法时
- 从不同的控制器在猫鼬更新时重复观察ng内部的变化