如何使用AngularJS模板的砌体？

Question

你好,我想用石工AngularJS.我想在容器中从左到右调整div.根据他们的文档,我们可以简单地使用它

<div class="js-masonry" data-masonry-options='{ "itemSelector": ".item", "columnWidth": 200 }'>
  <div class="item"></div>
  <div class="item"></div>
  <div class="item"></div>
  <div class="item"></div>
</div>

我在Angular中使用过这个

<div class="js-masonry" data-masonry-options='{ "itemSelector": "#masonry", "columnWidth": 200 }'>
     <div id="masonry" class="ng-scope" ng-repeat="comment in comments.data" style="position: absolute; left: 0px; top: 0px;">
     <div id="masonry" class="ng-scope" ng-repeat="comment in comments.data" style="position: absolute; left: 0px; top: 0px;">
     <div id="masonry" class="ng-scope" ng-repeat="comment in comments.data" style="position: absolute; left: 0px; top: 0px;">
</div>

我希望这些div从左到右自动调整(simliar到Isotope的砌体效果).第一次使用这个.任何帮助,将不胜感激.

Answer 1

有一个为此制作的包装：

https://github.com/passy/angular-masonry

如何使用它的简单示例：

<div masonry>
    <div class="masonry-brick" ng-repeat="brick in bricks">
        <img ng-src="{{ brick.src }}" alt="A masonry brick">
    </div>
</div>