当前位置: 首页 > 面试题库 >

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

颜畅
2023-03-14
问题内容

我需要通过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个项目。实现此目标的最佳方法是什么?

参考: 离子网格文档


问题答案:

我设法做到了$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。



 类似资料:
  • 好吧,我想强调这一点,并将其全部带入此线程,因为其余线程没有结论性的答案,因此在跳入它们之前,以下是我提到的线程: Adt 不会创建默认的问候世界,但命令行会创建 [已解决]日食在创建新项目/活动时行为不同 过去几天以来,ADT的行为有点古怪。我总是更新我的SDK,所以我经常运行SDK管理器并下载所有更新。最近我注意到,如果我创建一个新的android应用程序项目,它不会创建一个默认的MainAc

  • 首先,打开Android Studio并选择Create new Project,然后它会让你输入一个名字,你可以任意取一个名字,比如:Weather App。然后你需要输入公司域名。如果你不会真正发布这个app,这个字段就不是特别重要了,但是如果你有的话可以使用自己的域名。然后任意选择一个目录作为这个项目的保存地址。 下一步,它会让你选择最小的API版本。我们选择API 15,因为我们有一个库需

  • 创建任何新的 Android 项目后,Eclipse 会自动创建一个“appcompat_v7”项目,而 /src 下没有任何文件。我不知道Eclipse是如何或为什么创建这个项目的。我也得到了一个奇怪的错误。 正如你看到的AndroidManifest。项目中存在xml! EDIT1:清理项目后,奇怪的错误消失了,但我仍然想知道为什么创建appcompat_v7。 EDIT2:我还注意到Ecli

  • 我使用的是lombok版本5.1.0 为什么每次都在构建应用程序时创建lombok.config文件。 就是为了阻止这一切?

  • 启动一个新项目 执行下面的命令来创建一个新的 Django 项目: django-admin startproject myproject 命令行工具django-admin会在安装Django的时候一起自动安装好。 执行了上面的命令以后,系统会为Django项目生成基础文件夹结构。 现在,我们的myproject目录结构如下所示: myproject/ <--

  • 想象一下我有后续标记 和样式 由于某些原因,我无法更改的宽度,我是否可以通过对父容器进行样式化、使用flexbox或任何其他方式在每行中排列两个项目?