angularjs - ng-src 中的 Angular js '?' 导致无限循环

Question

我正在尝试解决 IE 在使用 AngularJS 时从缓存获取图像的方法

我有以下代码

<img ng-src="./individuals/image/{{team._id}}/{{member._id}}{{getRandom()}}" >

在 Controller 中

$scope.getRandom=function(){
        return "?ran="+new Date().getTime()+"";
}

当我运行时，我收到此错误

Error: 10 $digest() iterations reached. Aborting! Watchers fired in the last 5 iterations: [["fn: function (a){\n\"use strict\";\ntry{for(var b=0,c=q,g;b<c;b++){if(typeof(g=l[b])==\"function\")g=g(a),g==null||g==s?g=\"\":typeof g!=\"string\"&&(g=da(g));B[b]=g}return B.join(\"\")}catch(f){d(Error(\"Error while interpolating: \"+e+\"\\n\"+f.toString()))}}; newVal: \"./individuals/image/51c209ead8b8d863ad69de97/51c209ead8b8d863ad69de65?ran=1371757784485\"; oldVal: \"./individuals/image/51c209ead8b8d863ad69de97/51c209ead8b8d863ad69de65?ran=1371757784457\"","fn: function (a){\n\"use strict\";\ntry{for(var b=0,c=q,g;b<c;b++){if(typeof(g=l[b])==\"function\")g=g(a),g==null||g==s?g=\"\":typeof g!=\"string\"&&(g=da(g));B[b]=g}return B.join(\"\")}catch(f){d(Error(\"Error while interpolating: \"+e+\"\\n\"+f.toString()))}}; newVal: \"./individuals/image/51c209ead8b8d863ad69de97/51c209ead8b8d863ad69dec9?ran=1371757784487\"; oldVal: \"./individuals/image/51c209ead8b8d863ad69de97/51c209ead8b8d863ad69dec9?ran=1371757784459\"","fn: function (a){\n\"use strict\";\ntry{for(var b=0,c=q,g;b<c;b++){if(typeof(g=l[b])==\"function\")g=g(a),g==null||g==s?g=\"\":typeof g!=\"string\"&&(g=da(g));B[b]=g}return B.join(\"\")}catch(f){d(Error(\"Error while interpolating: \"+e+\"\\n\"+f.toString()))}}; newVal: \"./individuals/image/51c209ead8b8d863ad6

如果我删除 {{getRandom()}} 它工作正常。

请帮忙..提前致谢

更新:请在下面找到解决问题的 Controller 更改。感谢Liviu T的回答。

$scope.lastMillis = new Date().getTime();
    $scope.getRandom=function(){
        var curMillis = new Date().getTime();
        if (curMillis-$scope.lastMillis>5000) {
            $scope.lastMillis = curMillis;
        }
        return "?ran="+$scope.lastMillis;
    }

Answer 1

我认为问题在于 getRandom 函数每次调用时都会返回不同的值。发生的情况如下:

1. Angular 调用你的函数
2. 获取值
3. 看看它与之前的值不同
4. 将循环标记为脏
5. 循环完成后，它会重新运行循环，从而获得新值...

这个想法是让 getRandom 在一段时间内给出离散值。例如，仅每隔 1、10、30 秒给出一个新值，无论您认为合适。

实际上，这个建议适用于很多事情。 Angular 不保证它会调用绑定(bind)中的函数多少次。因此，您需要使它们更快，并且还需要确保对于相同的输入，它们返回相同的输出(大多数情况下，尽管在这种情况下可能是合理的)。

还要准确考虑图像何时/如何更改，以及实际更改是否可以由其他内容触发，仅在触发实际更改时才考虑为 getRandom 创建新的结果值(例如:用户上传新的个人资料图像，计时器执行等)

更新:无法在 plunker 中复制它使用 Chrome