一尘不染

在Angular ng-repeat中的每2个项目之后创建行-Ionic Grid

angularjs

我需要通过ng-repeat在我的应用程序中创建以下结构。

<div class="row">
  <div class="col-50">1</div>
  <div class="col-50">2</div>
</div>
<div class="row">
  <div class="col-50">3</div>
  <div class="col-50">4</div>
</div>

现在我的代码如下:

<div class="row">
  <label class="item item-radio col col-50" ng-repeat="a in question.answer">
  <input type="radio" name="answers"   class="a-{{ a.correct }}" value="{{ a.correct }}" ng-click='ansValue("{{ a.correct }}")'>

  <div class="item-content">
     <img src="img/ans/{{ a.option }}" />
  </div>

  <i class="radio-icon ion-checkmark"></i>
  </label>
</div>

但是在上面的代码中,它只有一个行标签。我不想以某种方式使行标记包含/包装循环中的每2个项目。实现此目标的最佳方法是什么?

参考: 离子网格文档


阅读 196

收藏
2020-07-04

共1个答案

一尘不染

我设法做到了$even

<div ng-repeat="number in numbers">

    <div class="row" ng-if="$even">
        <div class="col col-50">{{numbers[$index]}}</div>
        <div class="col col-50">{{numbers[$index + 1]}}</div>
    </div>

</div>

这是一个正在运行的JSFiddle。

2020-07-04