Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Used Swipe fix for ng-repeat, now it always loads to the last slide #55

Open
madcowvaping opened this issue Nov 10, 2016 · 1 comment
Open

Comments

@madcowvaping
Copy link

madcowvaping commented Nov 10, 2016

Hi Guys,

I have used the fix noted in #25
I am calling my data from a server json request using ng-repeat to display in my swiper. I know there is a previous issue using ng-repeat data with swiper, so I used the above fix. Most of the issue now is because I am using slides-per-view to try to create a 3 x 2 tiled effect of the data on screen. If I select 1 slide per view it is fine but when i select more than 1 slide per view the slides load correctly but default to the last slide, making the user then swipe back to the first slide. Once the user selects one of the slides it all works perfectly, this is just a problem on initial load, or reload.

This is my html view:

<ks-swiper-container initial-slide="0" slides-per-view="3" slides-per-column="2" slides-per-group="3" space-between="20" swiper="swiper" on-ready="onReadySwiper(swiper)" pagination-is-active="true" >
<ks-swiper-slide ng-repeat="cat in cats">
<a href="#/juice/{{cat.catid}}">
<img ng-src="{{ cat.imgpath }}" width="363" height="195" alt=""/>
</a>
</ks-swiper-slide>
</ks-swiper-container>
<div class="swiper-pagination"></div>

This is my Controller

angular.module('App.Controller', [])
.controller('CatController', ['$scope', 'categories', function ($scope, categories) {
     categories.success(function (data) {
          $scope.cats = data;
      $scope.onReadySwiper = function (swiper) {
	swiper.initObservers();
      };
  });
}])

I am very new to coding and forum etiquette, so if i haven't put enough information please let me know.
Thanks in advance for any help.

@noushad-pp
Copy link

noushad-pp commented Jul 3, 2017

try setting width 100vh to the slider container. Or wrap all the children elements or slider inside div component and set width to that div component

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

No branches or pull requests

2 participants