我正在使用ng-src显示图像:
< img style =“width:100px”ng-src =“{{absolutePath}} customImages / {{currentBook.idcode}}.png”/>
NetworkError:404 Not Found – http://localhost/learntracker/customImages/.png“
好像这是在变量存在之前执行的.
此HTML代码存在于< div ng-cloak ng-app =“mainModule”>内.和ng-cloak我理解在变量存在之前停止任何执行.
为什么会出现此错误,如何抑制它?
看起来您可能正在加载异步填充currentBook对象的数据.因此,在上一个摘要周期中,ng-src指令将为图像呈现没有currentBook.idcode值的src,并且一旦它填充在作用域上,另一个摘要周期就会运行更新图像.所以前一个导致404.你可以在图像上放置一个ng-if.
例如: –
<img style="width: 100px" ng-if="currentBook.idcode" ng-src="{{absolutePath}}customImages/{{currentBook.idcode}}.png"/>
您可以看到一个小型的演示实现here
但这似乎已经修复了1.3.x版本的角度,以便在所有插值扩展到获取值之前防止渲染图像src. Plnkr
ng-cloak
仅在角度加载时不会短暂暴露插值表达式.
一些额外的信息(Courtesy @zeroflagL):
对于角度版本1.3.x ng-src使用全部或全部插值(feature addition to interpolateProvider),这意味着除非解析所有绑定插值,否则它不会扩展指令.您可以在compile provider source中看到此映射.
ALL_OR_NOTHING_ATTRS = makeMap('ngSrc,ngSrcset,src,srcset'),