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. 获取值(value)
3. 看看和之前的值不一样
4. 将循环标记为脏
5. 循环完成后，它会重新运行循环，从而获得新值...

想法是让 getRandom 在一段时间内给出谨慎的值。例如，每 1 秒、10 秒、30 秒只给出一个您认为合适的新值。

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

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

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