带角度表达式绑定的无限循环

一尘不染

带角度表达式绑定的无限循环

angularjs

我有一个角度应用程序，它通过简单的表达式绑定显示由控制器方法返回的值：

<div>{{getValue()}}</div>

如果所讨论的方法仅返回一个值，则该方法将被调用两次，这很奇怪：

$scope.getValue = function(){
  return 'some value';
}

但是，如果该方法执行一些异步工作，例如从服务器获取文件，则代码将进入无限循环：

$scope.getValueAsync = function(){
  $http.get('myfile.html')
    .success(function (data, status, headers, config) {
      return 'some async value';
    });

  return 'file not found'; // same value returned every time but $digest cycle still loops
}

我是Angular的新手，所以这里可能错过了一些基本的知识，但是有人可以解释一下发生了什么吗？

柱塞

这是一个与 http://plnkr.co/7BriYDbdVJvIoIigQcTU一起玩的朋克

阅读 235

2020-07-04

共1个答案

一尘不染

即使您的异步函数每次都返回相同的字符串，由于循环使用$ http服务进行ajax调用，因此$ digest循环也会在循环中触发。

$ http服务$rootScope.$apply()
在请求完成时触发，并且由于$apply触发$
digest循环，因此它会重新评估视图表达式，这反过来又导致您的异步函数被再次调用，依此类推…

app.controller('MainCtrl', function($scope, $http) {

  $scope.getValue = function(){
    return 'some value';
  }

  $scope.getValueAsync = function(){
    $http.get('myfile.html')
      .success(function (data, status, headers, config) {
        return 'some async value';
      });

    return 'file not found';
  }
});



<div>{{getValueAsync()}}</div>

故事的寓意 ：如果在表达式中使用函数，请确保函数不会影响会触发$
digest循环的函数之外的事物，并确保在给定相同输入的情况下，函数始终返回相同的输出。

2020-07-04