Question

我是AngularJS的新手，如果这是非常基本的话，请道歉......

我想使用angular的'ng-repeat'指令重复一段html，它从控制器中的'$ scope.projects'数组中收集每个单独对象的数据。

我可以做得很好。我遇到的问题是原始静态文档使用了以下html结构：

<div class="row"> <!-- start row 1 -->

  <div class="one-half column">
    *project 1 html here*
  </div>

  <div class="one-half column">
    *project 2 html here*
  </div>

</div> <!-- end row 1 -->

<div class="row"> <!-- start row 2 -->

  <div class="one-half column">
    *project 3 html here*
  </div>

  <div class="one-half column">
    *project 4 html here*
  </div>

</div> <!-- end row 2 -->

......等等。

重复代码每次都包含在<div class="one-half column"></div>内，因此我将其复制到指令文件中引用的html模板中。这很好。

我的问题是<div class="row">标签只出现在每个其他时间，我不知道如何将这些标签动态地合并到我的代码中，从而使理论上无穷无尽的控制器阵列能够吐出正确的html，无需手动调整视图的html。

我考虑将上面的自定义指令放在包含<div class="row">标签的另一个自定义指令中，但我不认为ng-repeat能够处理这个......？

任何想法/解决方案都会受到广泛赞赏。

提前致谢。

Answer 1

我会使用ngIf进行模数计算。在结束行1和开始行2的行上，使用ng-if =＆＃34; $ index％2 === 0＆＃34;或类似的东西。

如果索引可以用2分割，则只会插入标记。

我还没有测试过代码或语法，但它应该会给你一个想法。

在响应式CSS框架中使用Angular的“ng-repeat”

1 个答案: