javascript - 在angularjs中使用ng-if出错

Question

我在我的应用程序中使用了 ng-if 标签，但是当我加载页面时，它似乎抛出了一个错误。

我的代码是这样的

<ons-col width="95px">
              <img src="{{PostDetail.attachments[0].images.square1.url}}" class="thumbnail" ng-if="PostDetail.attachments[0].url != null">
              <img src="images/location1.png" class="thumbnail" ng-if="PostDetail.attachments[0].url == null">
</ons-col>

当页面加载或重新加载时显示以下错误:

GET file://localhost/Volumes/Work%20Data/Development/Come%20to%20woodstock%20Ic…o%20Woodstock/www/%7B%7BPostDetail.attachments[0].images.square1.url%7D%7D net::ERR_FILE_NOT_FOUND

ng-if有没有问题？它在浏览器上运行时看起来不错，但是当我在我的谷歌浏览器中加载控制台时，我可以看到上面提到的一些奇怪的错误。有什么解决办法吗？

Answer 1

为了避免浏览器急切地从尚未插入的 URL 中检索图像，例如src="{{some.url}}"(因此导致 HTTP 错误)，您应该使用 ng-src:

<img ng-src="{{PostDetail.attachments[0].images.square1.url}}">

至于您的 ng-if，它似乎可以防止出现空的 PostDetail.attachments[0].url - 您确定您不是这个意思吗 PostDetail.attachments[0].images.square1.url?