angularjs – Owl Carousel无法识别ng-repeat的元素

我正试图让 owl carousel在Angular中工作.

我想在我看来这样做标记,因为我有很多画廊：

<owl-carousel owl-options="owlOptions">
  <div ng-repeat="image in gallery" class="item">
    <p>hello</p>
  </div>
</owl-carousel>

基本上所有指令应该做的是转盘的初始化.该指令完美无缺,除非我使用ng-repeat.我猜这个指令是在处理ng-repeat之前加载的.

有没有人对如何解决这个问题有任何想法,而不为每种类型的滑块构建模板和指令？

非常感谢！

这是指令：

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

    };
  }]);

你想看看这些答案：

ng-repeat finish event

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

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

<owl-carousel owl-options="owlOptions">
  <div owl-carousel-item ng-repeat="image in gallery" class="item">
    <p>hello</p>
  </div>
</owl-carousel>

原文地址：https://www.jb51.cc/angularjs/142464.html