问题原因：

在ng-src指令中传入一个空值时，图片的src属性不会更新，导致图片无法显示。

解决方法：

1. 在控制器中添加一个函数，判断传入的src是否为空，如果不为空则返回src，否则返回"//:0"。

2. 在ng-src指令中使用该函数来设置图片的源。

3. 或者直接在按钮点击事件中将superImage设置为"//:0"。

代码如下所示：

$scope.getImage = function(src) {
  if (src !== "") {
    return src;  
  } else {
   return "//:0"; 
  }
};
Remove superImage

但是需要注意的是，使用"//:0"作为图片的源并不是在所有浏览器中都有效。可以参考其他回答中的方法来解决该问题。

在讨论中，有人提出了一个解决空ng-src不更新图像的问题的方法，但在某些浏览器中并不起作用。最后，他们决定只有在src不为空时才显示该元素。根据之前提到的讨论，这似乎是最安全的选择。隐藏元素可以避免一些在不同浏览器中可能出现的问题。

后来，有人在评论中指出，ng-show中的"!==''"是完全不必要的。下面是更简洁的版本：

<img ng-show="theImage" ng-src="{{theImage}}">

对我来说，这个版本已经解决了问题，因为ng-show会将空字符串和null转换为false。

还某些情况下使用ng-show是更好的解决方法。虽然我实际上使用的是ng-if，但解决方案的概念是相同的。

虽然这个回答有点晚了，但是它提出了一个很好的观点。空字符串是假值，所以!==是完全不必要的。我会更新这个信息。

(empty ng-src doesn't update image)这个问题的出现的原因是Angular代码中的一段指令代码。这并不是一个bug，而是Angular团队决定的行为。从代码中可以看到，在第13895行开始，有如下指令代码：

forEach(['src', 'srcset', 'href'], function(attrName) {
   var normalized = directiveNormalize('ng-' + attrName);
   ngAttributeAliasDirectives[normalized] = function() {
      return {
         priority: 99, // it needs to run after the attributes are interpolated
         link: function(scope, element, attr) {
            attr.$observe(normalized, function(value) {
               if (!value)
                  return;
               attr.$set(attrName, value);
               if (msie) element.prop(attrName, attr[attrName]);
            });
         }
      };
   };
});

关键在于下面这段代码：

if (!value) return;

因此，如果将ng-src表达式更改为空字符串，这将不会更改实际的src值。可以通过MadScone建议的方法来解决这个问题。

问题更多的是，为什么他们选择这样的行为。这使得图像元素处于不一致的状态。在数据模型为空的情况下，图像仍然显示。

嗯，我不确定他们做出这个决定的想法是什么。我认为的是：根据HTML5规范，src必须是一个可能被空格包围的非空URL才能有效。但更重要的是，正如你可以在这里链接中阅读到的那样，一个空的src可能会导致多个问题。也许这就是他们试图避免的问题。

好的，谢谢你提供的这些链接！我之前对空src并不了解。无论如何，这个方法是一个很好的解决方法！诱人的是将这个方法添加到自定义指令（data-custom-src）中 🙂

你也可以使用jQuery直接设置图像的src。不确定这对后续的jQuery digest周期会产生多大的影响。