app组件图片轮播+加载图片错误显示默认图

Posted 2023-03-01 zhangyufeng0126

                        app组件图片轮播+加载图片错误显示默认图

效果图

代码事例

 <div class="ynNew-lb">
            <hy-image-indicator
                                hya-images="syggimages"
                                hya-indicator-position="bottomCenter"
                                hya-auto-recycle="true"
                                hya-image-on-click="syggimageOnClick(image)"
                                hya-recycle-time="4000">
            </hy-image-indicator>
        </div>

 //首页广告
    $scope.syggimages = [];
    var image = ;
    image.src =$scope.baseUrl+"img/homezx/sygg.png";
    image.errorSrc= $scope.baseUrl+"img/homezx/sygg.png";
    image.zxbs="false";
    $scope.syggimages.push(image);
    $scope.sygguserInfor='';
    sygguserNEWRquery ();
    /**
     *  首页广告
     */
    function  sygguserNEWRquery () 
        $scope.showModal('处理中...');//显示遮罩层
        var config = 
            responseType: 'json',
            cache: false
        ;
        var param = 
            pageNum:'1',
            pageCount:'5',
            pd:'04',
            fbqd:'1',
            date:''
        ;
        $hyHttp.post('appGetzxwh', config, param).success(function (bindingResult) 
            if (bindingResult.code == 0) 
                $scope.hideModal();
                $scope.sygguserInfor = JSON.parse(bindingResult.content);
               /* console.log('111',$scope.sygguserInfor);*/
                $scope.syggimages=[];
                for(var i=0;i<$scope.sygguserInfor.length;i++)
                     image = ;
                    if($scope.sygguserInfor[i].zxtp!=null&&$scope.sygguserInfor[i].zxtp!=undefined&&$scope.sygguserInfor[i].zxtp!="null")
                        image.src = $scope.sygguserInfor[i].zxtp;
                        image.zxbs=$scope.sygguserInfor[i].zxbs;
                        image.errorSrc= $scope.baseUrl+"img/homezx/sygg.png";
                        $scope.syggimages.push(image);
                    
                
                if( $scope.syggimages.length==0)
                     image = ;
                     image.src =$scope.baseUrl+"img/homezx/sygg.png";
                     image.errorSrc= $scope.baseUrl+"img/homezx/sygg.png";
                     image.zxbs="false";
                     $scope.syggimages.push(image);
                

             else if (bindingResult.code == 1) 
                $scope.sygguserInfor ="";
                $scope.hideModal();
                $scope.toast('数据加载失败！', undefined, 15);
            else if (bindingResult.code == 6) 
                $scope.sygguserInfor ="";
                $scope.hideModal();
                $scope.toast('请绑定用户！', undefined, 15);
            
        ).error(function () 
            $scope.sygguserInfor ="";
            $scope.hideModal();
            $scope.toast('数据加载失败！');
        );

    
    $scope.syggimageOnClick = function(image)
   /* console.log("image",image.zxbs)*/
        for(var i=0;i< $scope.sygguserInfor.length;i++)
            if ($scope.sygguserInfor[i].zxbs==image.zxbs)
                mainNavi.pushPage($scope.baseUrl+'pagesV2/homePage/findxq.html',versionContent:$scope.sygguserInfor[i],cancelIfRunning:true);
            
        
    ;

图片加在错误显示默认图

 <div class="ynNew-zxr">
                                <img ng-if="x.zxtp&&x.zxtp!=''" style="width: 100%;height: 100%"   onerror="imgOnError(this,'img/zmr/zmr2.png')"  ng-src="x.zxtp">
                                <img ng-if="!x.zxtp||x.zxtp==''" style="width: 100%;height: 100%"   onerror="imgOnError(this,'img/zmr/zmr2.png')"  ng-src="img/zmr/zmr$index%6.png">
                            </div>