角度和砌體一起工作

Question

我不會在ng-repeat內獲得砌體工作。

我嘗試添加一個石匠容器的類，並在我的ng-repeat內部使用類masonry-item。

在我的js我使用這兩個類，我的js文件被加載，如： -jquery -masonry -myfile

1. HTML）

<div class="masonry-container" > <div ng-repeat="link in links"> <div class="masonry-item col-sm-4"> <div class="jumbotron"> <div> {{link.title}} </div> <div> {{link.url}} </div> </div> </div> </div> </div>

1.1 JS ）

$(document).ready(function(){ 

    $('.masonry-container').masonry({ 
    // options 
    itemSelector: '.masonry-item', 
    columnWidth: '.masonry-item' 
    }); 
}); 

Answer 1

我不知道砌體，但是當你的JS被執行時，角沒有渲染模板。

要做你想做的事情，你應該使用指令，並把你的代碼放在link函數中。

angular.module('Example', []) 
.directive('masonry-container', [function() { 
    return { 
     link: function ($scope, element, attributs, controllers) { 
      element.masonry({ 
       // ... 
      }); 
      // ... 
     } 
    }; 
}]) 

指令希望修改DOM通常使用的鏈接選項 註冊DOM監聽以及更新的DOM。它在模板被克隆後被執行 ，並且其中指令邏輯將被放入 。

https://docs.angularjs.org/guide/directive