Ionic+angular使用中的一些小细节

1.ion-slide-box

show-pager="true"显示轮播翻页标记圆点;
auto-play="true"自动播放轮播图片
slide-interval="4500" 轮播图片间隔时间
does-continue="true" 循环播放图片(首尾相连)
注:
　　1)后台controller取数后需要手动刷新轮播该控件才能正常运行: $ionicSlideBoxDelegate.update();//手动刷新轮播
　　2)auto-play="true"仅对本地图片有效,要想获取图片地址后自动循环播放还需要加上这句:$ionicSlideBoxDelegate.$getByHandle("slideboximgs").loop(true);//无限循环
　　3)以上两行都需要先注入$ionicSlideBoxDelegate服务.
　　　
 1  <!--轮播 Begin-->
 2             <ion-slide-box show-pager="true" class="slidebox" auto-play="true" slide-interval="4500" delegate-handle="slideboximgs"
 3                            does-continue="true">
 4                 <ion-slide ng-repeat="item in goodsList" >
 5                     <div >
 6                         <img ng-src="{{item.imageaddress}}">
 8                     </div>
 9                 </ion-slide>
10             </ion-slide-box>
11  <!--轮播 END-->
1  $scope.goodsList = $scope.imagesTable.data;
2  $ionicSlideBoxDelegate.update();//手动刷新轮播
3  $ionicSlideBoxDelegate.$getByHandle("slideboximgs").loop(true);//无限循环

 

posted @ 2017-06-13 15:28  阿拉kiyo  Views(304)  Comments(0)  Edit  收藏  举报