用angularjs写了个项目用到了幻灯片我用swiper.js插件,现在遇到的问题是前台数据调用前执行了swiper.js代码,所以前台幻灯片错位了,swiper.js没拿到准确的循环个数,没有计算到。
有什么方法监听到前台数据循环完了再调用swiper.js代码呢?或者有其他什么方法可以解决这个问题呢?
认证0级讲师
控制器内不要去操作dom,找一下swiper for angular的组件,没有的话,正确的做法是把swiper封装到指令中,这样幻灯图片发生变化会自动重新渲染,并且可复用
https://github.com/ksachdeva/...这个组件应该能满足你所有需求
先贴一张我之前写的控制器appendSlide的代码截图
控制器里面调用appednSlide
var mySwiper = new Swiper(id) for(xxxxxxx){ mySwiper.appendSlide('<p class="swiper-slide" style="height:auto"><img src="'+$scope.slideimgs[i].imgAddress+'"/></p>') }
这是我当时ajax请求轮播图、加载完之后赋值的写法
我也遇到了同样的代码 下面是我的解决方法
.directive('repeatDone',function(){ return{
link:function(scope,element,attr){ if(scope.$last){ scope.$eval(attr.repeatDone); } }
}}).controller('',function(){
$scope.isRepeat=function(){ swiper代码; }
})<ul><li repeat-done="isRepeat()"></li></ul>
控制器内不要去操作dom,找一下swiper for angular的组件,没有的话,正确的做法是把swiper封装到指令中,这样幻灯图片发生变化会自动重新渲染,并且可复用
https://github.com/ksachdeva/...
这个组件应该能满足你所有需求
先贴一张我之前写的控制器appendSlide的代码截图
控制器里面调用appednSlide
这是我当时ajax请求轮播图、加载完之后赋值的写法
我也遇到了同样的代码 下面是我的解决方法
.directive('repeatDone',function(){
return{
}
})
.controller('',function(){
})
<ul><li repeat-done="isRepeat()"></li></ul>