zoukankan      html  css  js  c++  java
  • HTML__图片轮播ion-slide-box

    先大概描述一下要做的界面:

    从网络请求json数据,获取网络图征数据,然后轮播图片。我遇到的问题是:图片不显示,代码如下
    <ion-slide-box does-continue="true" show-pager="true" auto-play="true" slide-interval="1000">
    <ion-slide ng-repeat="item in homePage" >
    <div class="imgLoop">
    <img src="{{item.imgUrl}}" class="imgScroll"/>
    </div>
    </ion-slide>
    </ion-slide-box>
    解决办法:
    
    
    <ion-slide-box does-continue="true" show-pager="true" auto-play="true" slide-interval="1000" ng-if="homePage.length>0">
    <ion-slide ng-repeat="item in homePage" >
    <div class="imgLoop">
    <img src="{{item.imgUrl}}" class="imgScroll"/>
    </div>
    </ion-slide>
    </ion-slide-box>
    
    
    总结:主要就是加了一个判断条件 ng-if="homePage.length>0" ,大概意思就是:当数组homePage有值时,执行下标签里的内容。  如果不加ng-if  那么HTML在加载时,数组还没值 ,
    所以图片不会显示。因为网络请求是异步的,当异步请求结束后数组有值了,标签里的内容才会执行。
  • 相关阅读:
    Python3 循环语句
    Python3 条件控制
    Python3 字典
    Python3 元组
    Python的字符串函数
    2019/10/24
    JS-字符串方法总结
    maven环境变量配置
    PowerDesigner逆向导入MYSQL数据库并显示中文注释(转载)
    web_custom_request函数详解(转载)
  • 原文地址:https://www.cnblogs.com/wangdodo/p/5699477.html
Copyright © 2011-2022 走看看