swiper angular进行数据更新 出现空白 有没有其他的解决的方法

Question

就是更新recommendshop数据出现如图4的空白
（update方法使用过了没有用 observer属性方法计算量太大有点卡）

请问有什么解决办法么

Answer 1

可以先用空白占位符占位，然后给个正在加载的图片动画告诉用户正在加载图片，再者只能提高js加时间了，用异步加载的办法，放到页面的最后。

Answer 2

可以使用update

Answer 3

<div  class="swiper-container-new swiper-container">
                <div class="swiper-wrapper">
                    <div class="swiper-slide" repeat-finish align="center" ng-repeat="item in vm.new.documentFileList2">
                        <img class="img-responsive" ng-src="{{vm.url + item.fileStore}}">
                    </div>
                </div>
                <!-- Add Pagination -->
                <div class="swiper-pagination swiper-pagination-new"></div>
            </div>

我用的是加了一个directive;这个是页面；

.directive('repeatFinish',function(){
            return {
                link: function(scope,element,attr){
                    if(scope.$last){
                        setTimeout(function () {
                            var swiper = new Swiper('.swiper-container-new', {
                                pagination: '.swiper-pagination',
                                paginationClickable: true,
                                speed: 1500,
                                loop: true,
                                observer: true,
                                observeParents: true,
                                autoplayDisableOnInteraction: false,
                                autoplay: 3000
                            })
                        },300)
                    }
                }
            }
        })

在里面加了一个setTimeout,加个延迟时间，就不会出现了

Answer 4

我也遇到了这个问题，查询了好长时间，后来把spaceBetween: 10 这个属性去掉后就没问题了