title: angular directive for isotope layout
body: <p>I am new to angular, started exploring the custom directives, I was trying to create a custom directive for applying isotope layout once the ng-repeat completes the loading</p>
  
  <p>here is following code snippet </p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>var app = angular.module('myApp', []);
  
  
  app.directive('myDirective', function($timeout) {
    return {
      restrict: 'A',
      link: function(scope, element, attr) {
        if (scope.$last === true) {
          $timeout(function() {
            scope.$emit(
              $('.grid2').isotope({
                layoutMode: 'masonry',
                animationOptions: {
                  duration: 750,
                  easing: 'linear',
                  queue: false,
                }
              })
            );
          });
        }
      }
    }
  });
  
  app.controller('userNames', function($scope, $http) {
    $http.get("apicall").success(function(response) {
      $scope.names = response.response;
    });
  });</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div ng-controller="userNames"&gt;
    &lt;div class="grid2" my-directive ng-repeat="x in names"&gt;
      &lt;div class="box"&gt;&lt;span&gt;{{ x.username }}&lt;/span&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>the code is not working please help in fixing this.</p>