title: Owl Carousel not identifying elements of ng-repeat
body: <p>I'm trying to get <a href="https://github.com/smashingboxes/OwlCarousel2" rel="nofollow"> owl carousel</a> to work in Angular.</p>
  
  <p>I want to markup like this in my view, since I have many galleries :</p>
  
  <pre><code>&lt;owl-carousel owl-options="owlOptions"&gt;
    &lt;div ng-repeat="image in gallery" class="item"&gt;
      &lt;p&gt;hello&lt;/p&gt;
    &lt;/div&gt;
  &lt;/owl-carousel&gt;
  </code></pre>
  
  <p>Basically all the directive should be doing is initalizing the carousel. The directive works perfectly, unless I use an ng-repeat. I'm guessing the directive is loading before the ng-repeat is being processed.</p>
  
  <p>Does anyone have any ideas on how to solve this without building templates and directives for every style of slider?</p>
  
  <p>Thank you so much!</p>
  
  <p>Here is the directive:</p>
  
  <pre><code>angular.module('dir.owlCarousel', [])
    .directive('owlCarousel',[function() {
      return {
        restrict: 'EA',
        transclude: false,
        scope: {
          owlOptions: '='
        },
  
        link: function(scope, element, attrs) {
          $(element).owlCarousel(scope.owlOptions);
        }
  
      };
    }]);
  </code></pre>