Question

Я испытываю некоторое интересное поведение с угловой кладкой. Я загрузить его, как указано в их документации:

<input type="text" ng-model="searchString" ng-keyup="search()" /> 
<div masonry='{"gutter" : 25}'> 
    <div class="masonry-brick" ng-repeat="result in results"> 
     <div>{{result.description}}</div> 
    </div> 
</div> 

загружаю $ scope.results от вызова API при загрузке страницы и все выглядит отлично ... Кладка делает все кирпичи рядный, как можно было бы ожидать. После обновления $ scope.results из набора результатов API элементы отображаются в одном столбце слева от страницы. Стиль все еще выглядит великолепно, но я не могу использовать полную ширину страницы. Я в основном идут от:

---- ---- ---- 
---- ---- ---- 

к:

---- 
---- 
---- 
---- 
---- 
---- 

Есть ли способ сказать кладку пересчитывать сетку? или кто-нибудь еще нашел хороший способ решить эту проблему? Я прочитал несколько вопросов, а также посмотрел проект github, но я не могу найти подходящее решение.

Answer 1

Я не уверен, если это лучшее решение, но это работает для меня в подобной ситуации:

function refresh() { 
    common.$timeout(function() { $scope.$broadcast('masonry.reload'); }, 100); 
} 

Вызов refresh() всякий раз, когда источник данных изменяется/обновляется. Это заставит кладовую пересчитать макет.

Answer 2

Вызов

$('.grid').masonry('destroy'); 

как раз перед устанавливают новые данные для повторной модели. это помогло мне.