ng-src 的坑

问题:

  <ion-slide ng-repeat="item in bannrImgData" ng-click="getActivity($index)">

    <img src="{{item.imageUrl}}" alt="{{item.title}}" err-src="img/banner_load.png" style="min-height: 150px;"/>

  </ion-slide>

  页面加载出来以后,第一次图片加载失败,需要刷新页面,才可以加载成功。

解决方案:

  解析:如果是src 浏览器加载时默认直接调取 {{item.imageUrl}},这时数据还没有加载处理,需要改为 ng-src

  方案:将 src 改为 ng-src

时间: 2024-10-13 01:01:50

ng-src 的坑的相关文章

Angularjs 中的iframe 标签 ng-src 路径 报错问题 解决办法

iframe中的src直接替换成ng—src不可以,需要转换一下.Angular里面有个属性是专门用来解决跨域问题的 $sce. PS:$sce ($sce服务把一些地址变成安全的.授权的链接..)常用的方法有: $sce.trustAs(type,name); $sce.trustAsHtml(value); $sce.trustAsUrl(value); $sce.trustAsResourceUrl(value); $sce.trustAsJs(value);   $scope.someU

ng中用$http接后台接口的异步坑

最近笔者在一个项目中用ng去接后台的接口.因为前后端都是新手,前端的不懂后台,且没有经验:后端的不懂前端,也没有经验,然后接口bug百出,文档写得乱.一个接口,后台改了三次,我也是寸步难行. 首先来看看接口文档,开始这次的异步坑话题: ① ② ③ 可以看到图③是页面中要提供后端数据的四个下拉框,图②是提供给图③中学校下拉框的数据(当然接口文档数据只是提供参考的,真正数据在sql中,所以显示在视图中的数据和接口文档中的数据不大一样),图①是提供用户的默认数据的接口. 看完这些,在这方面稍有经验的前

vue 之img的src是动态渲染时(即 :src=&#39; &#39; )不显示 踩坑

问题: <img :src="item.image ? `../../assets/image/${item.image}` : ''" alt="image"/> 解决方法: 加上require() 即可 <img :src="item.image ? require(`../../assets/image/${item.image}`) : ''" alt="image"/> vue 之img的sr

总结一下ng中的那些坑

ps由前面几篇归纳而来,以后更新在这篇文档中 1.angularjs的一个小坑:div里有控件使用时,例如datepicker,不能使用ng-if来判断是否显示此div,不然只有第一次点击的时候会调出日历控件...应该用ng-show... 2.框里有required,但是该按钮不需要进行表单验证时,需要在该按钮上添加type="button",不然会自动进行表单验证.. 3.日期控件一定要加ng-required="true",不然选择一个日期再清空以后日期会变成

mpvue 踩坑之src数据绑定出错

原文链接:https://blog.csdn.net/weixin_38984353/article/details/80847288 src实现数据绑定稍不留神就不成功.假定value.src是绑定的数据. 常见错误写法1: <img src="value.src"> 错误之处在于: 1.属性值数据绑定应该用v-bind,应该写成v-bind:src="" 2.直接用引号"value.src"会报错,取不到值. 常见错误写法2: &

【Vue中的坑】vue项目中动态绑定src不显示图片解决方法

v-for绑定src的数据如下: data() { return { img_src:"../../assets/images/mirror-service.png" } } 渲染之后,发现图片不显示,上网查找之后发现是应为图片链接是需要通过 require包裹的 data() { return { img_src:require("../../assets/images/mirror-service.png)" } } 然后就会发现好使了 原文地址:https:/

关于 angular js 的坑

angular js 很好很强大,但是注意,angular js并不适合操作DOM,虽然在某个版本更新过之后,angular 内部自建了 jqLite 来方便操作DOM,意图取代jquery的位置,真是居心叵测. 其实 angular 最好的地方还是给我们提供了一个新的思维方式,如果你是个新手,想看看传说中的 MVC 是个啥,在 ember, backbong, angular...等等众多框架中犹豫不决,那么推荐先看看angular 当然坑是很多,由于马上 2.* 的版本要出现,所以自然 1.

js 面试的坑

判断页面滚动方向(上下) <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style> body{ height:1000px; } </style> <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"

Vue 脱坑记 - 查漏补缺(汇总下群里高频询问的xxx及给出不靠谱的解决方案)

前言 发现群里有些问题的提问重复率太高了,每次都去回答,回答的贼烦.这里做一个大体的汇总,废话不多说,直接开始给出方案,不是手把手..若是连问题和解决都看不懂的..应该去补充下基础知识 问题汇总 Q:安装超时(install timeout) 方案有这么些: cnpm : 国内对npm的镜像版本 /* cnpm website: https://npm.taobao.org/ */ npm install -g cnpm --registry=https://registry.npm.taoba

【转】Vue 脱坑记 - 查漏补缺(汇总下群里高频询问的xxx及给出不靠谱的解决方案)

前言 文章内容覆盖范围,芝麻绿豆的破问题都有,不止于vue; 给出的是方案,但不是手把手一字一句的给你说十万个为什么! 有三类人不适合此篇文章: "喜欢站在道德制高点的圣母婊" – 适合去教堂 "无理取闹的键盘侠" – 国际新闻版块欢迎你去 "有一定基础但又喜欢逼逼的人" 得得得,老子知道你厉害了,你好牛逼,这些问题那么简单,都是小白看的 这种傻瓜文,简直浪费老子的时间! 对于以上三类人,走吧,这里不是你来装逼的地方. 你们也不值得看老子花那么多