angularjs 中的 owl.carosusel 错误

Question

我正在使用这个 owl.carousel 指令，我的应用程序的想法是在用户单击每个项目时获取项目列表，我打开一个模式，根据 id 显示项目列表。第一次单击第一个项目时，轮播正确显示，之后我关闭模式并单击第二个项目，轮播失败。

这是我的代码：

$scope.item_click = function(id){
  ServGetItemsById.servicioGetItemsById(id).success(function(data, status){
    $scope.all_items = data.items;
    var modal = document.getElementById('modal');
    modal.style.display = "block";
  })
  .error(function(data, status){            
  })
  .finally(function(){})
}

我的html

<data-owl-carousel class="owl-carousel" data-options="owlOptionsTestimonials">
  <div owl-carousel-item="" ng-repeat="i in all_items" class="item">
    <img src="{{i.img}}"/>
    <div>
      <p class="white-text center">{{i.name}}</p>
    </div>
  </div>
</data-owl-carousel>

提前致谢

Answer 1

我无法使该指令生效。我猜也许某些 angular 缓存即使在 initCarousel 重复触发时也能使元素保持活动状态。也许某些旧版本的 angular 没有这个问题？

无论如何，您始终可以删除该元素并强制指令创建一个新元素。 ng-if 救援：

<div ng-if="all_items.length > 0">
  <data-owl-carousel class="owl-carousel" data-options="owlOptionsTestimonials">
    <div owl-carousel-item="" ng-repeat="i in all_items" class="item">
      ...
    </div>
  </data-owl-carousel>
</div>

并且在控制器中。

// Remove items before fetching new ones to triggers the ng-if.
$scope.all_items = []; 
ServGetItemsById.servicioGetItemsById(id).success(function(data, status){
...

恕我直言，这违背了该指令的目的，但是您要做什么呢？哦，这次我确实试过了！ http://jsfiddle.net/k988Loru/

angularjs 中的 owl.carosusel 错误

Error with owl.carosusel in angularjs

javascript

angularjs

owl-carousel