防止img加载angularjs

Question

我有一个带图像的div:

<div ng-if="showIt">
    <img src="{{filepath}}/{{filename}}">
    <!-- ... and a bunch other other elements -->
</div>

事情是{{filepath}},{{filename}}如果showIt是假的话将是null .

但是,我总是在控制台中看到404错误,因为我认为Angularjs正在呈现整个DOM,然后删除ng-if评估为false 的位.这意味着即使showIt是假的,浏览器也总是会请求不存在的图像.

有没有办法阻止DOM创建整个div块,以便浏览器永远不会请求不存在的图像？

Answer 1

使用ng-src:

<img ng-src="{{filepath}}/{{filename}}">

您看到的404错误不是由ng-if引起的.它们是由浏览器在Angular评估角度表达式之前尝试加载图像引起的.ng-src只有在src评估表达式后才会将属性添加到图像中,从而避免HTTP请求{{filepath}}/{{filename}}.