Использование угловой кладки в AngularJS?

Question

У меня такой макет. Я использую расширение passsy для angular masonry.

<masonry column-width="200"> 
    <div class="masonry-brick" ng-repeat="data in comments"> 
     <div ng-switch on="data.type"> 
     <div ng-switch-when="hoots">   
      <article class="hoot_main"> 
      //content goes here 
      //hoot_main is the main class for this div layout 
      </article> 
      </div> 
     </div> 
     </div> 
     <div ng-switch on="data.type"> 
     <div ng-switch-when="article">   
     <article class="hoot_main"> 
     //content goes here 
     //hoot_main is the main class for this div layout 
     </article> 
     </div> 
    </div> 
     <div ng-switch on="data.type"> 
     <div ng-switch-when="story">   
      <article class="hoot_main"> 
      //content goes here 
      //hoot_main is the main class for this div layout 
      </article> 
     </div> 
     </div> 
    </div> 
</masonry> 

Браузер повесит всякий раз, когда я его использую. Сценарий отладки с инструментами говорит, что element.masonry не является функцией.

Любая помощь будет оценена!

Answer 1

Хм, на данный момент я работаю с моего ноутбука дома, и я не могу запустить версию Passy, ​​и я не могу погладить эту проблему. Но это то, что я могу предложить вам сейчас:

Я сделал очень простую директиву, основанную на вещах, я где-то читал:

app.directive('masonry', function() { 
    return { 
    restrict: 'AC', 
    controller: function($scope) { 
     return $scope.$watch(function(e) { 
     $scope.masonry.reloadItems(); 
     return $scope.masonry.layout(); 
     }); 
    }, 
    link: function(scope, elem, attrs) { 
     var container=elem[0]; 
     var options=''; 
     return scope.masonry = new Masonry(container,options); 
    } 
    }; 

Как вы можете видеть, что это не имеет каких-либо опций сейчас , Когда я буду работать в понедельник, я буду смотреть на свои источники на подходящем двухэкранированном дисплее и предоставить вам лучшую версию. Моя жена начинает придать мне внешний вид, и мне нужно убрать ноутбук сейчас. : - \

Вы можете видеть in this plunker, что он сейчас работает. Может быть, это может вам помочь. Тем временем вы можете добавить некоторые ваши данные json в свой вопрос? У вас хороший уик-энд!

Answer 2

У меня была эта ошибка, исправлена ​​с помощью оригинального кода масонства. Я тоже думал, что это чистый угловой порт.

Answer 3

Для того, чтобы получить angularjs директиву Пасси рабочего необходимо включить все файлы, перечисленные в индексный файл