3

编辑:

好的,我更新了示例以避免循环问题,所以回到原来的问题,它仍然会重新计算 B 模型对象。

在这个例子中:http: //jsfiddle.net/qn2Wa/

<div ng-app>
    <div ng-controller="A"><input ng-model="m">
        {{a()}}
    </div>
    <div ng-controller="B"><input ng-model="m">
        {{b()}}
    </div>
</div>

JS

function A($scope) {
    $scope.m='a';
    var counter = 0;
    $scope.a = function(){
        console.log("A " + counter++);
        return $scope.m;
    }
}
function B($scope) {
    $scope.m='b';
    var counter = 0;
    $scope.b = function(){
        console.log("B " + counter++);
        return $scope.m;
    }
}

一旦我更改控制器 A 中的输入值,它就会调用 b() ,它位于一个完全独立的控制器中。为什么它会重新计算其他控制器中的模型对象?有没有办法避免这种情况?

如果您看到控制台日志,您可以看到每次在 A 输入字段中输入内容时都会打印 B,该输入字段位于完全独立的控制器和范围中。


仅供参考我在这里保留问题的原始代码。它有错误,因为它正在更新函数调用中的模型,正如一些评论所指出的,这在上面的代码中得到了修复。该错误可以移至一个单独的问题。

http://jsfiddle.net/m8xtA/

<div ng-app>
    <div ng-controller="A"><input ng-model="m">
        {{a()}} - {{counter}}
    </div>
    <div ng-controller="B"><input ng-model="m">
        {{b()}} - {{counter}}
    </div>
</div>

JS

function A($scope) {
    $scope.m='a';
    $scope.counter = 0;
    $scope.a = function(){
        $scope.counter++;
        return $scope.m;
    }
}
function B($scope) {
    $scope.m='b';
    $scope.counter = 0;
    $scope.b = function(){
        $scope.counter++;
        return $scope.m;
    }
}
4

2 回答 2

2

这是一个可行的解决方案:

http://jsfiddle.net/m8xtA/1/

使用$watch是实现这一目标的好方法。

function A($scope) {
    $scope.m='a';
    $scope.counter = 0;
    //executed each time `m' is changed
    $scope.$watch('m',function(){
        $scope.counter++;
    })
}
function B($scope) {
    $scope.m='b';
    $scope.counter = 0;
    //executed each time `m' is changed
    $scope.$watch('m',function(){
        $scope.counter++;
    })
}    

希望有帮助,加油

于 2013-09-08T17:39:22.493 回答
1

在模板渲染过程中,如果你改变了用于绑定模板的模型或对象,将会触发一个新的渲染循环,最终进入一个死循环。会导致这个错误'Error: 10 $digest() iterations reached. Aborting!'.

在您的代码中,当{{a()}}被渲染时,它counter通过语句修改对象$scope.counter++;,这将触发无限循环,因为在模板{{counter}}中需要渲染。

(您看到的是由损坏的评估引起的,因此您会看到一些时髦的行为。)

于 2013-09-08T17:43:43.810 回答