Wie verwende ich Mauerwerk mit AngularJS-Schablone?

Question

Hallo Ich möchte Mauerwerk in AngularJS verwenden. Ich möchte div von links nach rechts in Container anpassen. Nach ihrer Dokumentation können wir es einfach verwenden

<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> 

ich mit dieser in Angular verwendet haben wie

<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> 

Ich möchte diese div von links nach rechts (simliar Isotop des Mauereffekt) AutoAdjust. Verwenden Sie dies zum ersten Mal. Jede Hilfe wäre willkommen.

Answer 1

Es gibt einen Wrapper für diese gemacht:

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

Ein schnelles Beispiel dafür, wie es zu benutzen:

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