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

从网络请求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在加载时,数组还没值 ,
所以图片不会显示。因为网络请求是异步的,当异步请求结束后数组有值了,标签里的内容才会执行。

HTML__图片轮播ion-slide-box的更多相关文章

  1. 原生js+css3实现图片自动切换,图片轮播

    运用CSS3transition及opacity属性 制作图片轮播动画 自己这两天根据用js来控制触发CSS3中transition属性,从而写出来的以CSS3动画为基础,js控制过程的图片轮播 运用 ...

  2. Unslider Web前端框架之图片轮播

    前端框架,前端组件,前端库,都是一个意思,能看源码. 最近做H5小游戏,用到了图片轮播的组件,而且要求支持移动端触屏滑动.一开始用的是nivo slider,但是对大小不一样的图不支持box 的参数设 ...

  3. jquery 图片轮播demo实现

    转载注明出处!!! 转载注明出处!!! 转载注明出处!!! 图片轮播demo,弄清楚过程其实是一个很简单的东西,看网上都没有什么实质性的代码,就自己把过程捋了一遍实现了. 这次因为随手写的,所以没有做 ...

  4. 图片轮播(bootstrap)与 圆角搜索框(纯css)

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http ...

  5. 利用bootstrap写图片轮播

    利用bootstrap写图片轮播 缺点是轮播没有固定样式图片样式会改变外框的大小,所以要再设置 以及左右按钮的style也要从新设置 <div class="carousel slid ...

  6. 使用js制作一般网站首页图片轮播效果

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. jquery图片轮播效果(unslider)

    今天做网站(住建局网站)需要用到图片轮播,刚开始想借鉴DTCMS上的,查看CSS与页面代码,呵呵,不复杂,直接复制过来,结果调整半天,页面还是各种乱,没办法,网上找一个吧,于是找到了今天要说的这货un ...

  8. 分享jquery实现百叶窗特效的图片轮播

    首先非常感谢网友嘉翼的无私分享,这是他刚在网站扣下来的特效,第一时间与大家分享,jquery实现百叶窗特效的图片轮播 使用方法: 1.引用css文件,css文件里面已经做了注释,基本只需要修改宽高就好 ...

  9. 基于bootstrap的图片轮播效果展示

    <!DOCTYPE html><html lang="zh-CN"> <head> <meta charset="utf-8&q ...

随机推荐

  1. 获取DOS命令的返回值.

    procedure CheckResult(b: Boolean); begin if not b then raise Exception.Create(SysErrorMessage(GetLas ...

  2. git diff的使用

    有时候可能睡觉时候忘记关电脑了,然后不小心触碰到键盘上某个神秘的按钮了,然后自己也不知道就提交了 就可能很悲剧 那么有时候不知道自己是否改变了哪些文件的内容 这时候就需要用到git diff git ...

  3. 【转】使用ant来调用Jmeter,并定制运行时参数

    为了应对不同的运行需求(主要是不同的线程数),以及可能的变化(host ip),在nongui运行时我对ant build.xml进行了一些修改 1. log目录备份与运行前清除 <tstamp ...

  4. ORACLE GoldenGate在Windows与AIX平台ORACLE的单向、双向数据传输配置及其测试

    第1章...... GoldenGate概述 1.1         GoldenGate技术原理 1.2         GoldenGate可靠的复制 1.3         GoldenGate ...

  5. 什么是Ajax和JSON,它们的优缺点

    什么是Ajax??? 术语Ajax用来描述一组技术,它使浏览器可以为用户提供更为自然的浏览体验. Ajax它是“Asynchronous JavaScript + XML的简写” 定义Ajax: Aj ...

  6. 决策树 ID3 C4.5 CART(未完)

    1.决策树 :监督学习 决策树是一种依托决策而建立起来的一种树. 在机器学习中,决策树是一种预测模型,代表的是一种对象属性与对象值之间的一种映射关系,每一个节点代表某个对象,树中的每一个分叉路径代表某 ...

  7. vc6.0出现“cannot add new member”解决办法

    在编辑一个工程的时候,添加一个按钮,对这个按钮产生消息函数 双击按钮之后出现 cannot add new member 网上说删除.clw文件 我发现并没有这个后缀的文件 以下是我的操作办法:   ...

  8. 使用JAVA实现模拟登陆并发送新浪微博(非调用新浪API)

    没有调用新浪的API,在程序中加入自己的帐号和密码就能发送微博,代码完全在后台运行,不用打开浏览器. 用了HtmlUnit这个库来模拟登录还有发送微博. 先上效果图: 这个是刚登陆上获取第一页的信息. ...

  9. 「小程序JAVA实战」微信开发者工具helloworld(三)

    转自:https://idig8.com/2018/08/09/xiaochengxu-chuji-03/ 第一个小程序demo的运行,首选需要去使用开发工具 开发工具下载安装 https://mp. ...

  10. 数据预处理:PCA,SVD,whitening,normalization

    数据预处理是为了让算法有更好的表现,whitening.PCA.SVD都是预处理的方式: whitening的目标是让特征向量中的特征之间不相关,PCA的目标是降低特征向量的维度,SVD的目标是提高稀 ...