Sw in鎖定

我想要在同一頁面上獲得多個SWIPERS（idangero.us/swiper/），我正在設置一個商店，並且我想爲每個類別顯示不同的swipe，我輕鬆生成，這裏的問題是，第二次刷卡inits鎖定和鮑勃迪倫放大它被解鎖，我可以掃過之後某些原因：視頻與問題：https://streamable.com/s/a88zy/jutbzh Sw in鎖定

最奇怪的是，我試圖複製，但在撥弄它按預期工作：https://jsfiddle.net/g4b0_88/L9ph48ev/

下面的代碼在那裏我產生swipers爲每個類別：

$scope.loadSwiper = function(idcat){ 
$scope.swiperSliders[idcat-1] = new Swiper('.swiper'+$scope.store.categories[idcat-1].idcategory, { 
direction: 'horizontal', 
loop: false, 
nextButton: '.button-next'+$scope.store.categories[idcat-1].idcategory, 
prevButton: '.button-prev'+$scope.store.categories[idcat-1].idcategory, 
slidesPerView: 'auto', 
spaceBetween: 0, 
freeMode: true 
}); 
$scope.swiperSliders[idcat-1].unlockSwipes(); 
};

在這裏，在那裏我加載每個類別的類別和產品的HTML：

<div ng-repeat="category in store.categories" ng-repeat-end-watch="categoriesWatcher"> 
      <h1 class="category">{{category.name}}</h1> 
       <div class="swiper-container swiper{{category.idcategory}}"> 
        <div class="swiper-wrapper featured-carousel"> 
         <div class="swiper-slide product-block" ng-repeat="product in store.featured_products[category.idcategory-1]"> 
          <div id="note{{product.idproduct}}" class="add_product_note note{{product.idproduct}}" ng-show="product_in_cart.data[product.idproduct]"><i class="fa fa-pencil-square-o" ng-click="addProductNote($ev, product.idproduct)" aria-hidden="true"></i></div> 
          <div class="product-img"> 
           <img class="center-block" ng-src="<?php echo site_url('/assets/product-img/'); ?>{{product.image}}"/> 
          </div> 
          <div class="product-name"> 
           <h4>{{product.name}}</h4> 
          </div> 
          <div class="product-desc"> 
           <h4>{{product.description}}</h4> 
          </div> 
          <div class="product-price"> 
           <p>{{product.sell_price | currency}}</p> 
          </div> 
          <div class="product-add" ng-show="product.type == 2"> 
           <ngcart-addtocart id="{{product.idproduct}}" name="{{product.name}}" price="{{product.sell_price}}" quantity="1" img="<?php echo site_url('assets/product-img/');?>{{product.image}}" ptype="{{product.type}}" note="">Agregar</ngcart-addtocart> 
          </div> 
          <div class="product-add" ng-show="product.type == 1"> 
           <ngcart-addtocart id="{{product.idproduct}}" name="{{product.name}}" price="{{product.sell_price}}" quantity="0.1" img="<?php echo site_url('assets/product-img/');?>{{product.image}}" ptype="{{product.type}}" note="">Agregar</ngcart-addtocart> 
          </div> 
         </div> 
        </div> 
        <div class="swiper-button-prev button-prev{{category.idcategory}}"></div> 
        <div class="swiper-button-next button-next{{category.idcategory}}"></div> 
       </div> 
      </div>

正如我所說，Swipers加載正確但被鎖定在某種原因和縮放，或zooming-時解除了出。

來源

2017-10-08 g4b0.88

我找到了解決辦法，而是採用$scope.swiperSliders[idcat-1].unlockSwipes();我把下面的代碼塊：

$timeout(function(){ 
$scope.swiperSliders[idcat-1].onResize(); 
$scope.swiperSliders[idcat-1].update(true); 
}, 100);

來源

2017-10-09 16:44:44

回答

相關問題