Open edamon opened 8 years ago
Each slider has it's own isolated scope, so this can be a bit of a challenge.
You could create an event when the slider slides, and emit an event with the current index. Then a event listener can invoke a .slideTo to the other slider with the passed index.
You could a bind it to the onSlideChangeEnd
event, and transition the opposite slider.
Possible ideas, not sure how perfectly sync it would be however.
In order to achieve this, I had to add the swiper_uuid to the swiper instance: $timeout(function() { var swiper = null;
if (angular.isObject($scope.swiper)) {
$scope.swiper = new Swiper($element[0].firstChild, params);
swiper = $scope.swiper;
} else {
swiper = new Swiper($element[0].firstChild, params);
}
swiper.swiper_uuid = $scope.swiper_uuid; //<--add uuid to swiper instance
console.log(swiper.swiper_uuid);
//If specified, calls this function when the swiper object is available
if (!angular.isUndefined($scope.onReady)) {
$scope.onReady({
swiper: swiper
});
}
});
I'll try to make a pull request soon
if I have more than one swiper, and I want them to stay in sync, how do I do that?