Javascript 使用角度动态ng src时延迟加载图像

应用程序中有许多图像标记，ng src在每个图像中都是动态的，如：

<div ng-controller="load_product">
<img ng-controller="image_controller" ng-src="{{product.image}}" />
</div>
<div ng-controller="load_brand">
<img ng-controller="image_controller" ng-src="{{brand.image}}" />
</div>

对于延迟加载，我的方法是将图像的src替换为虚拟1px图像（如果它不在视口中），并将原始src存储在另一个属性lazysrc中，如果图像在视口中，则更改为原始src，即如果图像在视口中，则将值从lazysrc复制到src

但对于这一点，我需要一个事件，当图像的ng src被解析，但对图像的请求不是通过浏览器发送的

注意：load_product和load_brand控制器在某些事件后加载数据。所以，我需要在加载数据时将src复制到lazysrc，解析了ngsrc，但并没有发送映像请求。我想在数据加载和ng src解决后停止此请求

我不想在任何情况下更改HTML，因为它是一个有上千页的应用程序

 $($element).load(function () {......})
 $($element).error(function () {......}).