Angularjs 自动滑动-旋转木马的角转盘

Angularjs 自动滑动-旋转木马的角转盘,angularjs,carousel,Angularjs,Carousel,所以我看到了Revolunet开发的角度旋转木马和rn旋转木马自动滑动等功能。问题是我应该在哪里将这个特性注入到我的代码中?我已经试着把它注射到几个不同的标签上,但似乎无法让它起作用。。希望有人能帮我解决这个问题。。。下面是我的代码实现 <div class="exploreCarousel"> <div ng-controller="CarouselCtrl" ng-init="init(<?php echo $topic_id?>

所以我看到了Revolunet开发的角度旋转木马和rn旋转木马自动滑动等功能。问题是我应该在哪里将这个特性注入到我的代码中?我已经试着把它注射到几个不同的标签上,但似乎无法让它起作用。。希望有人能帮我解决这个问题。。。下面是我的代码实现

    <div class="exploreCarousel">
    <div ng-controller="CarouselCtrl"
        ng-init="init(<?php echo $topic_id?>)" id="slides_control">
        <ul rn-carousel class="image" rn-carousel-indicator>
          <li ng-repeat="image in slides">
            <div><img ng-src="<?php echo UrlMgmt::getExploreImageUrl()?>{{image.image}}" class="layer" rn-carousel-auto-slide/></div>
          </li>
        </ul>
    </div>
</div>
这将是到Revolunet的存储库的链接,以防我没有告诉你们


谢谢

看来rn carousel auto slide有一个bug,我只是试着让它工作并浏览了它的代码。 它使用element.children来确定有多少张幻灯片,但在启动时只执行一次-这将适用于硬编码到HTML中的静态插入幻灯片-您应该将其添加到UL标记中。但是,由于您希望将它与ng repeat一起使用,因此需要对它进行修改,以便在ng repeat完成后检查元素的子元素长度,或者在增量函数的每次迭代中检查它。 我很快就会修好并提出拉车请求。 同时添加以下内容:您必须使用模块和指令的src版本,而不是缩小版本,并且您应该在将rn-carousel-auto-slide.js复制到bower_组件之外的某个位置后进行此更改(假设您使用bower等)

$timeout(function () {
      slidesCount = element.children().length;
}, 100); // can probably be shorter but this is safe.

实际上,您不必接触文件,以下是如何操作:

设置rn转盘索引=cpos 在控制器中:

var position = false,
  interval = 5000,
  slides = [
  {
    image: './images/carousel/image-1.jpg',
    title: 'this is the title',
    link: '//beta.dungeondefenders.com',
    text: 'this is the description, can be long, can be long, can be long, can be long, can be long, can be long'
  },
  {
    image: './images/carousel/image-2.jpg',
    title: 'this is the title',
    link: '//beta.dungeondefenders.com',
    text: 'this is the description, can be long, can be long, can be long, can be long, can be long, can be long'
  }];


$interval(function () {
  var newPos = 0;
  if(position) {
    newPos = $scope.cpos +1;
    if(newPos > slides.length -1) {
      newPos = 0;
    }
  } else {
    position = true;
  }

  logger.info(position,newPos,slides.length-1);
  $scope.cpos = newPos;
}, interval);

$scope.cpos = position;
$scope.slides = slides;

不过,这仍然是一个解决办法。

亲爱的纳达夫·西奈,我遵循了你的方法,目前它工作得完美无缺。。。非常感谢您帮助我理解函数是如何工作的。一旦您提出拉取请求,请务必通知我。。。非常感谢你,伙计:你应该提出一个带补丁的拉拽请求!: