Question

我正在使用AngularJS开发应用程序。我想在页面中显示产品列表，但是成对出现，因此每行将显示两个图像。使用REST服务加载产品。因此，我们假设我们已经在集合＆＃34;产品中加载了所有产品＆＃34;。我用来迭代产品的代码是：

<div id="products">
    <div class="row" data-ng-repeat="product in products">
        <div class="col-xs-12">
            <img alt="" 
                 data-ng-src="{{product.pathToImage}}" 
                 height="300"
                 width="200px">
        </div>
    </div>
</div>

像这样，所有的产品都会连续显示出来，是否有某种方式可以让某些人给我一些想法来迭代这个集合但是在同一行中显示两个（或更多）图像？

非常感谢你！

Answer 1

选项1：将产品分类为数组对数组，其中数组对各包含两个产品。然后，您可以进行双重重复。

Ng-repeat =成对配对 Ng-重复产品成对出现 Img代码在这里

选项2：采用角度方式＆＃34;并创建自己的自定义角度过滤器，将数据按摩为可在单个ng-repeat中循环的格式。您可以使用＆＃34; |＆＃34;在ng-repeat中应用过滤器。我不打算给你代码，因为你需要花一些时间自己实现一些基本的自定义过滤器，以了解它们是如何工作的，你可以参考几个在线博客。 Egghead.io是一个很好的资源。

如何在html中使用AngularJS成对显示图像

1 个答案: