角度无限的$digest环
我在一个网站上工作，在那里你可以搜索一种食物，看看它是水果，蔬菜，还是两者都不是(因为我很无聊)。我决定使用Angular，尽管我对它还很陌生。我开始收到这个错误：$rootScope:infdig Infinite $digest Loop
这可能是也可能不是确切的措辞或错误，因为页面滞后太多，我无法打开Javascript控制台。
这是我的结果视图控制器：
app.controller('resultController', ['$scope', '$routeParams', '$http',
function($scope, $routeParams, $http) {
$scope.result = $routeParams.query;
$scope.whatIsIt = function() {
$http.get('json/foods.json').success(function(data) {
var lists = JSON.parse(data);
var itIsA = 'uuggghhhhh';
if (lists['fruit'].contains($scope.result)) {
itIsA = 'fruit';
} else if (lists['vegetable'].contains($scope.result)) {
itIsA = 'vegetable';
}
});
}
}]);下面是我的应用程序模块：
var app = angular.module('fruitOrNot', [
'ngRoute'
]);
app.config(['$routeProvider' ,
function($routeProvider) {
$routeProvider.when('/', {
templateUrl: 'layouts/fruit-search.html',
controller: 'searchController'
}).when('/:query', {
templateUrl: 'layouts/result.html',
controller: 'resultController'
});
}]);下面是layout/result.html t.html：
<h1>{{ result }}</h1>
<p>{{ result }} is a {{ whatIsIt() }}</p>所以我想知道是什么导致了$digest循环错误，或者如何找出，因为我不能使用控制台。谢谢!
整个项目也是在Github上运行的here。
回答 4
Stack Overflow用户
发布于 2014-07-06 12:13:12
您遇到的问题是您在作用域上设置了一个字段，该字段隐式调用$digest并重新布局模板。但是，布局模板再次发出http请求，然后更改作用域，这将调用$digest。这就是无限循环。
您可以通过确保在模板布局期间不会触发http请求来避免这种情况。
实现应用程序的一种更有角度的正确方法是将GET请求提取到适当的服务中，然后将服务注入控制器中。
然后在控制器中进行服务调用，如下所示：
app.controller('resultController', ['$scope', '$routeParams', 'whatsitService',
function($scope, $routeParams, $http) {
$scope.result = $routeParams.query;
whatsitService.doit().then(function(result) {
$scope.whatsit = result;
}
})
;您的模板将如下所示：
<h1>{{ result }}</h1>
<p>{{ result }} is a {{ whatsit }}</p>Stack Overflow用户
发布于 2014-07-06 12:27:39
问题是您试图调用一个函数并直接发布返回值，而您试图返回的值超出了作用域。您需要将该值放在作用域中。
代码片段：
app.controller('resultController', ['$scope', '$routeParams', '$http',
function($scope, $routeParams, $http) {
$scope.result = $routeParams.query;
$scope.itIsA = "";
$scope.whatIsIt = function() {
$http.get('json/foods.json').success(function(data) {
var lists = JSON.parse(data);
var itIsA = 'uuggghhhhh';
if (lists['fruit'].contains($scope.result)) {
$scope.itIsA = 'fruit';
} else if (lists['vegetable'].contains($scope.result)) {
$scope.itIsA = 'vegetable';
}
});
}
}]);在HTML模板中：
p>{{ result }} is a {{itIsA}}</p>Stack Overflow用户
发布于 2016-06-02 20:51:26
如果您已将表达式绑定到无限$digest循环，则在以下情况下可能会发生该无限循环：{{events()}}
和
$scope.events = function() { return Recording.getEvents(); }
但在下面的例子中不是这样的。即使您已经绑定了{{events}}
$scope.events = Recording.getEvents();
原因是在第一个角度假设每个摘要循环中的值都在变化，并且不断更新。在第二个中，它只是简单地等待承诺。
https://stackoverflow.com/questions/24592283
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号