CODEWITHSUNDEEP
carouselangular-ui-bootstrap
Mr Bonjour
Mr Bonjour

Reputation: 3400

angular uib-carousel, active slide not working

I would like something as simple as displaying a selected index from the carousel slide. But for some reason it doesn't work.

The documentation is kinda cryptic so i'm not sure if I do it correctly. Here is my html (Note: there is some flask | ninja inside it, what is important here is the active="slide.active"):

 <uib-carousel id="over" active="active" interval="myInterval" no-wrap="noWrapSlides" ng-swipe-left="next()" ng-swipe-right="prev()">
    <uib-slide ng-repeat="slide in slides track by slide.id" index="slide.id" active="slide.active">
      <a href="{{url_for('display_keetle_detail')}}">
        <img class="irmg" ng-src="{{slide.image|angular}}" style="margin:auto;" ng-click="test(slide.id)">
      </a>
      <div class="carousel-caption">
      </div>
    </uib-slide>
  </uib-carousel>

So my carrousel is working. But for example, from my js, I would like to display the 3th index:

 $scope.slides[3].active = true;

Where slides is an array of slide. From the documentation it says that it make the slide 'active'. I'm not sure if it means that making it active will display it as the current slide of the carousel as I expect.

Upvotes: 1

Views: 4204

Answers (1)

Rob J
Rob J

Reputation: 6629

The active value on the uib-carousel directive is used to manage which uib-slide directive index value is active. Since slide.id is the index value of the slides, you would need to use: $scope.active = slides[3].id.

Upvotes: 2

Related Questions