javascript - Angular JS：使用 ng-switch 并检查文件是否存在

Question

我正在循环浏览一个东西列表，如果一个东西有一个图像，我想显示它。

但是如果一个东西没有图像，我想显示默认文本：

<div ng-repeat="myThing in myThings>
  <div ng-switch on="{{myThing.img}}" >
    <span ng-switch-when="{{myThing.img}}">
      <img src="/img/myThings/{{myThing.id}}" />
    </span>
    <span ng-switch-default>No Image</span>
  </div>
</div>

这有效并显示默认文本。

但是，浏览器在尝试获取不存在的图像时也会抛出错误：

http://localhost:9000/img/myThings/%7B%7BmyThing.id%7D%7D 404 (Not Found)

有没有办法格式化这个 ng-switch 函数，这样就不会抛出这个错误？

Answer 1

使用ng-src而不是src，这是来自文档：

在 src 属性中使用像 {{hash}} 这样的 Angular 标记不能正常工作：浏览器将从带有文本 {{hash}} 的 URL 获取，直到 Angular 替换 {{hash}} 中的表达式。ngSrc 指令解决了这个问题。

<img ng-src="/img/myThings/{{myThing.id}}" />