javascript - 模型更改时，AngularJS 不会更新 img src

Question

我ng-src用来加载图像。值是从某个范围变量加载的，如下所示：

<img ng-src="{{currentReceipt.image}}"/>

我的问题是，当我运行时delete $scope.currentReceipt，它使ng-src属性为空，但没有反映在src属性中。因此，我一直在需要空占位符的地方看到该图像。

我该如何处理？

Answer 1

这是 ngSrc 和 ngHref 指令的预期行为。这些指令仅支持识别新路径，但当路径不可用时，指令将静默退出（我在这里看到了拉取请求。）。

因此，一种可能的解决方法是在图像变量不再可用时使用 ngShow 和 ngHref 来完全隐藏标签：

<img ng-href="{{currentReceipt.image}}" ng-show="currentReceipt.image" />

Answer 2

删除 $scope.currentReceipt 后调用 $scope.$apply()。

Answer 3

以下解决方案对我有用：

<img ng-src="{{currentReceipt.image}}" ng-show="currentReceipt.image != null" />

Answer 4

您实际上可以检查长度并执行

 <img ng-show="user.thumbnail.length > 1" class="img-circle thumb pull-left" ng-src="{{user.thumbnail}}" alt="{{user.firstname}} {{user.lastname}}">