Owl Carousel not identifying elements of ng-repeat

Question

I\'m trying to get owl carousel to work in Angular.

I want to markup like this in my view, since I have many galleries :

Answer 1

You want to take a look at these answer:

ng-repeat finish event

AngularJS event for when model binding or ng-repeat is complete?

angular.module('dir.owlCarousel', [])
  .directive('owlCarousel',[function() {
    return {
      restrict: 'EA',
      transclude: false,
      scope: {
        owlOptions: '='
      },
      link: function(scope, element, attrs) {
          scope.initCarousel = function() {
            $(element).owlCarousel(scope.owlOptions);
          };
        }
      }
    };
  }])
  .directive('owlCarouselItem',[function() {
     return function(scope) {
     if (scope.$last) {
        scope.initCarousel();
     }
    };
  }]);


  

    
hello