Angular UI Bootstrap Carousel。无法删除幻灯片只有addSlide选项

时间:2015-10-08 07:02:14

标签: javascript angularjs twitter-bootstrap angular-ui-bootstrap

这是我的angular-bootstrap-ui轮播代码:

angular.module('ui.bootstrap.demo').controller('CarouselDemoCtrl', function ($scope) {
  $scope.myInterval = 5000;
  $scope.noWrapSlides = false;
  var slides = $scope.slides = [];
  $scope.addSlide = function() {
    var newWidth = 600 + slides.length + 1;
    slides.push({
      image: '//placekitten.com/' + newWidth + '/300',
      text: ['More','Extra','Lots of','Surplus'][slides.length % 4] + ' ' +
        ['Cats', 'Kittys', 'Felines', 'Cutes'][slides.length % 4]
    });
  };
  for (var i=0; i<4; i++) {
    $scope.addSlide();
  }
});

和轮播正在逐渐填充

<carousel interval="myInterval" no-wrap="noWrapSlides">
  <slide ng-repeat="slide in slides" active="slide.active">
    <img ng-src="{{slide.image}}" style="margin:auto;">
    <div class="carousel-caption">
      <h4>Slide {{$index}}</h4>
      <p>{{slide.text}}</p>
    </div>
  </slide>
</carousel>

我想在特定事件后刷新幻灯片。意思是删除所有幻灯片并替换为全新的幻灯片。

当我尝试清除这样的幻灯片时

slides = $scope.slides = [];

特定点击事件后。并再次尝试addSlide。

for (var i=0; i<4; i++) {
    $scope.addSlide();
  }
现在根本没有出现旋转木马。

需要帮助!

0 个答案:

没有答案