Skip to content
This repository has been archived by the owner on May 29, 2019. It is now read-only.

fix(carousel): respect the order of the slides #3416

Closed
wants to merge 1 commit into from

Conversation

ayakovlevgh
Copy link
Contributor

I've added a new parameter (index) to the slide directive which is used to order slides:

<slide ng-repeat="slide in slides" index="$index">
    <!-- slide content here -->
</slide>

You can see it on plunker:

Fixes #488

index parameter is added to the slide directive. It is used to order the
slides.

Fixes angular-ui#488
@karianna karianna added this to the 0.13.0 milestone Mar 22, 2015
@@ -1,6 +1,6 @@
<div ng-mouseenter="pause()" ng-mouseleave="play()" class="carousel" ng-swipe-right="prev()" ng-swipe-left="next()">
<ol class="carousel-indicators" ng-show="slides.length > 1">
<li ng-repeat="slide in slides track by $index" ng-class="{active: isActive(slide)}" ng-click="select(slide)"></li>
<li ng-repeat="slide in slides | orderBy:'index' track by $index" ng-class="{active: isActive(slide)}" ng-click="select(slide)"></li>
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can you extend this so that it can support functions as well? It should support all of the possibilities of orderBy IMO.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Sorry, but I'm not sure that I understand what you mean. In this peace of code we're just ordering the carousel indicators by the slide index parameter. Do you mean that we should do something like this:

<li ng-repeat="slide in slides | orderBy:orderIndicators track by $index" ng-class="{active: isActive(slide)}" ng-click="select(slide)"></li>

and then in controller:

$scope.orderIndicators = function(slide) {
    return slide.index;
};

What's the purpose of such extension?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

So my concern is if the user is doing something like

<slide ng-repeat="slide in slides | orderBy: customOrderFn">
...
</slide>

I'm not sure whether that custom order would be respected by this implementation.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

it would be, please check this plunker: http://plnkr.co/edit/pmCFIH0GCpBjNBWY8g1D?p=preview.

@wesleycho
Copy link
Contributor

Landed as b5f220f, thanks for the work here!

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

bug(carousel): carousel fails to update model changes
3 participants