AngularJS的404图像加载问题

Question

我想在网站上放一个二维码，可以说它可能是从ASP.NET MVC Action提供的任何图像文件 - 但在这种情况下它是一个二维码。

<div class="qrcodeview" >
    <h2>SCAN</h2>
    <img id="qr" src="{{qrlink}}" />
</div>

我将一些查询字符串args传递给我的端点以生成QR代码，该代码作为GIF返回。使用AngularJS，我设置了<img/>标记src属性。

在AngularJS控制器中构建url和querystring。

我的问题是，在Angular加载并将数据绑定到控件之前，当浏览器尝试获取图像时，我会在更换Angular表达式之前收到HTTP 404错误。

脚本运行后，按预期显示QR码。

宁愿不得到此HTTP错误。我能以某种方式推迟负荷吗？或者使用AngularJS略有不同（更正确吗？）

谢谢！

Answer 1

在AngularJS有机会使用正确的值更新属性之前，使用src会在初始加载时导致HTTP请求。

使用ng-src代替，以便AngularJS在准备就绪时可以创建src属性。然后，这将自动触发HTTP请求以获取图像。

<div class="qrcodeview" >
    <h2>SCAN</h2>
    <img id="qr" ng-src="{{qrlink}}" />
</div>

AngularJS文档中的更多信息：

AutoCAD`s Developers Guide