swiperjs如何在angular中使用?

<body ng-controller="AppController" ng-cloak>
    <div class="container">
        <div class="top_shuffling swiper-wrapper row">
            <div class="swiper-slide"><img src="img/shufflings/shufflings_1.jpg" alt=""></div>
            <div class="swiper-slide"><img src="img/shufflings/shufflings_2.jpg" alt=""></div>
            <div class="swiper-slide"><img src="img/shufflings/shufflings_3.jpg" alt=""></div>
            <div class="swiper-slide"><img src="img/shufflings/shufflings_4.jpg" alt=""></div>
            <div class="swiper-slide"><img src="img/shufflings/shufflings_5.jpg" alt=""></div>
        </div>
    </div>
</body>
App.controller("AppController",function($scope,$timeout){
    $scope.swiper=function(){
        var topSwiper = new Swiper('.top_shuffling',{
            loop: true,
            autoplay:4000,
            paginationClickable :true,
            autoplayDisableOnInteraction : false,
            observer:true,//修改swiper自己或子元素时,自动初始化swiper
            observeParents:true,//修改swiper的父元素时,自动初始化swiper
            prevButton:".swiper-button-prev",
            nextButton:".swiper-button-next"
        });
    }
    $scope.swiper();
})

这样写打开页面不会轮播,求解哪里有问题,angular小白伤不起。。

阅读 2.8k
2 个回答

用directive包一下可以

把 $scope.swiper=function(){ 改成 function swiper()..试试
不知道你用的哪个Swiper,请说明下文档
$scope是用来和模版交互的

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题