我有一个像喇叭一样的角度重复,
<div class="row" > <div class="col-md-6" ng-repeat="(index,data) in mydata"> <-- my content --> </div> </div>
这将创建如下的输出,
<div class="row" > <div class="col-md-6" ng-repeat="(index,data) in mydata"> <-- my content --> </div> <div class="col-md-6" ng-repeat="(index,data) in mydata"> <-- my content --> </div> ----------------------- ----------------- Etc. </div>
但我需要重复< div class =“row”>还包括每行中两个< div class =“col-md-6”. 这个输出需要像
<div class="row" > <div class="col-md-6" ng-repeat="(index,data) in mydata"> <-- my content --> </div> </div> <div class="row" > <div class="col-md-6" ng-repeat="(index,data) in mydata"> <-- my content --> </div> </div> <div class="row" > <div class="col-md-6" ng-repeat="(index,data) in mydata"> <-- my content --> </div> </div> ------- Etc
使用ng-repeat可以做到这一点吗？
解决方法
正如评论中所提到的,如果你想让你的行重复mydata中的每个元素,你需要在< div>上添加ng-repeat.包含行.
由你决定是否要对内部< div>进行硬编码.像这样：
<div class="row" ng-repeat="data in mydata">
<div class="col-xs-6"> {{data.index}} </div>
<div class="col-xs-6"> {{data.value}} </div>
</div>
或使用其他ng-repeat.
<div class="row" ng-repeat="(index,data) in mydata">
<div class="col-xs-6" ng-repeat="i in data"> {{i}} </div>
</div>
其中mydata是一个具有以下结构的json数组：
$scope.mydata = [{index:0,value:'hello'},{index:1,value:'hello1'},{index:2,value:'hello2'}
]
这是plunkr
更新：
如果您有以下数据,
$scope.mydata = [{value:'hello0'},{value:'hello1'},{value:'hello2'},{value:'hello3'}];
而你想要显示它
hello0 hello1
hello2 hello3
在视图中,那么你需要检查偶数迭代中出现的元素,并在$index和$index 1处打印元素.我使用了$even.但您也可以创建自定义过滤器.
<div class="row" ng-repeat="data in mydata">
<div ng-if="$even">
<div class="col-xs-6" > {{mydata[$index].value}} </div>
<div class="col-xs-6" > {{mydata[$index + 1].value}} </div>
</div>
</div>
继续更新plunker
