如何创建与使用 div 进行 ng-repeat 一致的图像的 ng-repeat？答案

【问题标题】：How to create ng-repeat of images that appear in line with using a div for the ng-repeat?如何创建与使用 div 进行 ng-repeat 一致的图像的 ng-repeat？
【发布时间】：2016-06-07 18:53:41
【问题描述】：

我目前在 ng-repeat 中有很多图像。我希望他们水平填充页面然后再往下走（有点像谷歌图片......他们填满了整个页面）。好吧，我需要在父 div 上有 ng-repeat，因为我正在根据某些图像标准和堆叠事物等进行一些 ng 类的事情。我最初拥有的代码（当我在图像上使用 ng-repeat 时）运行良好，但现在我需要在 div 上使用 ng-repeat，它正在重复 div 属性，使图像堆栈。我从here 得到了那个解决方案。这是之前的代码：

<img class="movImg" ng-src="{{movie.imgPath}}" ng-repeat="movie in movies"/>

现在我需要做这样的事情：

 <div data-ng-repeat="movie in movies">
    <div class="mainContent" Overflow:scroll style="">
       <img class="movImg" ng-src="{{movie.imgPath}}"/>
    </div>
</div>

重复有效，但我最终在一列中有十亿张图片。有谁知道我如何在 div 上使用 ng-repeat，但保持布局与以前一样（动态列数/图像占据页面宽度）？

这是我正在使用的 CSS

.mainContent {
  padding-left:10px;
  padding-right:10px;
  width:100%;
  height:100%;
  margin-top:40px;
  overflow:scroll;
  padding-bottom:50px;
}
.movImg {
  display:inline;
  margin:7.5px;
  width:150px;
}

【问题讨论】：

我会将重复放在父 div 上，然后使用 css 来控制一行可以容纳多少张图片。它只需要一个中继器。
所以我目前正在尝试将 ng-repeat 放在父 div 上（如第二个代码块所示），但我不知道如何连续获取图像。
嗯，你在使用引导程序吗？也许你应该为 div 添加一些引导类？
display: inline; div

标签： javascript html css angularjs

【解决方案1】：

这个问题的答案是我需要在ng-repeat的div上放一个display:inline的样式。谢谢大家的帮助。

【讨论】：