同步两个角度ui自举转盘

Question

我正在尝试使用angular ui bootstrap在页面中创建两个同步轮播。我尝试设置变量

 myinterval 

相同。对于两个旋转木马相同。但过了一段时间后他们会失去同步。此外，如果用户悬停在一个旋转木马上，它也应该暂停另一个旋转木马。关于如何实现这一目标的任何指示。

以下是一个例子http://plnkr.co/edit/SOy6yn7MAQ98tgmvVucC?p=preview

Answer 1

能够在这些线程的帮助下解决它。

How do you Bind to Angular-UI's Carousel Slide Events?

Setting active slide on angular-ui-bootstrap carousel

1）通过

获取第一个轮播的当前幻灯片

$scope.$watch(function () {
  for (var i = 0; i < slides.length; i++) {
  if (slides[i].active) {
      return slides[i];
     }
    }
  }, function (currentSlide, previousSlide) {
      if (currentSlide !== previousSlide) {
       console.log('currentSlide:', currentSlide);
    }
 });

2）现在你有了当前的幻灯片。使用此索引设置第二个轮播。