ionic ion-slide-box 实现

H5 代码

<ion-slide-box style= " height: 100 % ; " active-slide= "vo.slideIndex" on-slide-changed= "vc.slideChange($index)" delegate-handle= "imgeSlide" auto-play= "true" does-continue= "true" show-pager= "false" >

     <ion-slide ng-repeat= "imge in vo.imges" >

          <img ng-src= "{{'data:image/png;base64,'+imge.FileBase64}}" height= "90%" style= " margin-top:3vw; " />

     </ion-slide>

</ion-slide-box>

 

js代码

$scope.vc = {

      //图片滚动

     slideChange: function(index) {

            $scope.vo.slideIndex = index;

            $ionicSlideBoxDelegate.$getByHandle( "imgeSlide").slide($scope.vo.slideIndex);

     },

     getDpSgfjBase64: function(orgid, dwjb, fjlxdm, gzhj, scsj, rows) {

           ionicService.showIonicLoading(LOADING);

           pwbService.getDpSgfjBase64(orgid, dwjb, fjlxdm, gzhj, scsj, rows, function(data) {

                 ionicService.hideIonicLoading();

                  if(data.successful) {

                        $scope.$apply( function() {

                              $scope.vo.imges = data.resultValue;

                              //网络加载需要更新图片

                              $ionicSlideBoxDelegate.$getByHandle( "imgeSlide").update();

                              //循环滚动

                              $ionicSlideBoxDelegate.$getByHandle( "imgeSlide").loop(true);

                        });

                  } else {

                        ionicService.toast(TOAST_NETWORK_REQUEST_FAILURE);

                  }

            }, function(msg) {

                  ionicService.hideIonicLoading();

                  ionicService.toast(msg);

            });

      }

 }