我试图创建一个结构,每7个重复的div有一个额外的div插入.这个div必须属于父母,而不是一个重复的div的孩子.
只要改变课程是不够的,整个内容将会有所不同,完全不同的ngShow逻辑将与附加的div一起使用.
所以例如:
<div id="parent"> <div class="child"></div> <div class="child"></div> <div class="child"></div> <div class="child"></div> <div class="child"></div> <div class="child"></div> <div class="child"></div> <div class="special-child"></div> <div class="child"></div> <div class="child"></div> <div class="child"></div> <div class="child"></div> <div class="child"></div> <div class="child"></div> <div class="child"></div> <div class="special-child"></div> <div class="child"></div> <div class="child"></div> <div class="child"></div> <div class="child"></div> <div class="child"></div> <div class="special-child"></div> </div>
该示例使用特定数量的div,ngRepeat可以是任何数字.同样重要的是,ngRepeat的最后一个结果是在其后添加一个div,即使它不是7的确切倍数.
我使用的当前ngRepeat逻辑是:
<div id="parent"> <div class="child" ng-repeat="o in data"></div> <div class="special-child"></div> </div>
但是这不能正常工作,因为额外的div只能在所有重复的div之后插入一次.
更新工作示例
<div id="parent"> <div class="child" ng-repeat-start="o in data"></div> <div class="special-child" ng-if="( $index + 1 ) % 7 == 0 || $last" ng-repeat-end></div> </div>
该解决方案需要AngularJS 1.2
你需要接近这个的东西:
<div ng-repeat="o in data"> <div class="child"></div> <div ng-if="$index % 7 == 0" class="special-child"></div> </div>