javascript 当模型更改时,AngularJS 不会更新 img src
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/17492980/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
AngularJS doesn't update img src when model changes
提问by Sergei Basharov
I use ng-src
to load images. Value is loaded from some scope variable, like this:
我ng-src
用来加载图像。值是从某个范围变量加载的,如下所示:
<img ng-src="{{currentReceipt.image}}"/>
My issue is that when I run delete $scope.currentReceipt
, it makes ng-src
attribute empty but doesn't reflect it in src
attribute. So as a result I keep seeing that image where I need empty placeholder.
我的问题是,当我运行时delete $scope.currentReceipt
,它使ng-src
属性为空,但不会在src
属性中反映出来。因此,我不断看到需要空占位符的图像。
How can I deal with it?
我该如何处理?
回答by Stewie
This is the expected behaviour from the ngSrc and ngHref directives. These directives only support recognising new paths, but when path is not available, the directives will exit silently(I see a pull request here.).
这是 ngSrc 和 ngHref 指令的预期行为。这些指令仅支持识别新路径,但是当路径不可用时,指令将静默退出(我在这里看到一个拉取请求。)。
So a possible workaround could be to use ngShow along with the ngHref to hide the tag altogether when image variable is not available anymore:
因此,当图像变量不再可用时,可能的解决方法是使用 ngShow 和 ngHref 来完全隐藏标签:
<img ng-href="{{currentReceipt.image}}" ng-show="currentReceipt.image" />
回答by Hardik Chauhan
call $scope.$apply() after delete $scope.currentReceipt.
删除 $scope.currentReceipt 后调用 $scope.$apply()。
回答by Mingyu
The following solution works for me:
以下解决方案对我有用:
<img ng-src="{{currentReceipt.image}}" ng-show="currentReceipt.image != null" />
回答by Michel Arteta
You can actually check for length and do
你实际上可以检查长度并做
<img ng-show="user.thumbnail.length > 1" class="img-circle thumb pull-left" ng-src="{{user.thumbnail}}" alt="{{user.firstname}} {{user.lastname}}">