取决于ng-重复项的引导实例大小

Question

我正在尝试用ng-重复图像填充我的站点。我想要做的事情是，如果图像中只有一个图像，它将得到一个完整的行(col-xs-12)，如果有两个映像，它们将作为col-xs-6加载，最多可以加载6个图像(每幅图像中有一个-xs-2)。

有可能像这样演奏吗？我想把它们列为ul>li>img + description。

干杯!

Answer 1

你可以这样写

  <ul>
       <li ng-repeat="image in images" ng-class="{'col-xs-12':images.length== 1 ,  }">
       </li>

  </ul>

Answer 2

是的，实际上使用 directive of Angular是可能的。

您可以做的是调用一个函数，其中包含返回相应Bootstrap class的图像数量。

Answer 3

你也可以这样做：

<ul>
     <li ng-repeat="image in images" class="col-xs-{{Math.floor(12 / images.length)}}">
     </li>
</ul>

这样，将自动设置列的宽度。问题是，如果您有超过12幅图像，宽度将为0。