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

【问题标题】：Angular JS: using ng-switch and checking if file existsAngular JS：使用 ng-switch 并检查文件是否存在
【发布时间】：2013-07-29 18:00:11
【问题描述】：

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

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

<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 函数，这样就不会抛出这个错误？

【问题讨论】：

标签： javascript angularjs ng-switch

【解决方案1】：

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

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

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

【讨论】：