Angular JS - 如何在 ng-repeat 中添加额外的 DIV [英] Angular JS - How to add extra DIV in ng-repeat
问题描述
我有一个数组 a=[1,2,3,4,5,6]
.
在这个数组上使用 ng-repeat
,我创建了 6 个 div
.
请参阅此plunker
有没有办法在每一行之后再添加一个div
.所以在 3 个 div 之后,我想添加一个额外的 div
.
我查看了这个例子.但他们正在创建一个子div
.是否可以在 ng-repeat
div
让我们试试 ng-repeat-start &ng-重复结束.
<div class="square" ng-repeat-start="friend in a">{{$index}}<div ng-if="$index % 3 == 2" ng-repeat-end>额外的div
请注意,从 angular 1.2.1 开始包含 ng-repeat-start 指令.
ng-repeat:重复一个"父元素的一系列元素
<!--====中继范围======--><Any ng-repeat="朋友中的朋友"></任何><!--====中继器范围结束======-->
ng-repeat-start &ng-repeat-end:使用ng-repeat-start和ng-repeat-end定义扩展中继范围的起点和终点
<!--====中继范围从这里开始======--><任何 ng-repeat="朋友中的朋友" ng-repeat-start>{{friend.name}}</Any><!-- ng-repeat 元素不再是重复范围的终点--><!--仍在中继器范围内--><h1>{{friend.name}}</h1><!--带有ng-repeat-end"指令的HTML标签定义范围的终点--><页脚ng-repeat-end></页脚><!--====中继器范围结束======-->
I have an array a=[1,2,3,4,5,6]
.
Using ng-repeat
on this array, I am creating 6 divs
.
Please refer to this plunker
Is there any way to add one more div
after each row. So after 3 divs I want to add one extra div
.
I looked into this example. but they are creating a child div
. is it possible to create a sibling div
in ng-repeat
Let's try ng-repeat-start & ng-repeat-end.
<div class="example-animate-container">
<div class="square" ng-repeat-start="friend in a">
{{$index}}
</div>
<div ng-if="$index % 3 == 2" ng-repeat-end>
extra div
</div>
</div>
Please note that ng-repeat-start directive is included since angular 1.2.1.
ng-repeat: repeat a series of elements of "one" parent element
<!--====repeater range=====-->
<Any ng-repeat="friend in friends">
</Any>
<!--====end of repeater range=====-->
ng-repeat-start & ng-repeat-end: using ng-repeat-start and ng-repeat-end to define the start point and end point of extended repeater range
<!--====repeater range start from here=====-->
<Any ng-repeat="friend in friends" ng-repeat-start>
{{friend.name}}
</Any><!-- ng-repeat element is not the end point of repeating range anymore-->
<!--Still in the repeater range-->
<h1>{{friend.name}}</h1>
<!--HTML tag with "ng-repeat-end" directive define the end point of range -->
<footer ng-repeat-end>
</footer>
<!--====end of repeater range=====-->
这篇关于Angular JS - 如何在 ng-repeat 中添加额外的 DIV的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!