一尘不染

github无法识别ng-repeat的元素

angularjs

我正在尝试让github在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);
      }

    };
  }]);

阅读 255

收藏
2020-07-04

共1个答案

一尘不染

何时完成模型绑定或ng-repeat的AngularJS事件?

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();
     }
    };
  }]);

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