AngularJS orderBy通过与ngModel相同的属性抛出$ digest错误
[英]AngularJS orderBy same property as ngModel throws $digest error
问题描述
When I try to orderBy a property that I am binding to in a ng-repeat I get a $digest error. 
当我尝试在ng-repeat绑定要绑定的属性时，出现$digest错误。 I think it is occurring because in one digest the ng-model value is updating, which effects the parents orderBy clause. 我认为这是因为在一个摘要中ng-model值正在更新，这会影响父母的orderBy子句。 I do not know how to get around this. 我不知道该如何解决。
Plunker (Update) 柱塞（更新）
This shows the issue occurring. 这表明发生了问题。 Be sure to open the console! 确保打开控制台！
http://embed.plnkr.co/rGLagq/preview http://embed.plnkr.co/rGLagq/preview
JS JS
var options = [
{
name: 'test',
isSelected: true
},
{
name: 'another test',
isSelected: false
}
];
HTML HTML
<div ng-repeat="option in options | orderBy:'-isSelected'">
<label>
<input type="checkbox"
ng-model="option.isSelected"> {{option.name}}
</label>
</div>
Error 错误
Error: [$rootScope:inprog] $digest already in progress
3 个解决方案
解决方案1
1 已采纳 2014-11-12 22:50:36
This issue is caused by a bug in angular: 此问题是由角度错误引起的：
https://github.com/angular/angular.js/issues/10014 https://github.com/angular/angular.js/issues/10014
Should hopefully be fixed by: https://github.com/angular/angular.js/pull/9808 有望通过以下方式修复： https ： //github.com/angular/angular.js/pull/9808
Target fix version: 1.3.4 目标修订版本： 1.3.4
解决方案2
0 2014-11-12 01:59:12
Make sure you don't have manual calls like $scope.$apply() or $scope.$digest in your code that will kick off digest cycles manually. 确保您的代码中没有手动调用$ scope。$ apply（）或$ scope。$ digest这样的手动调用，这些手动调用将启动摘要循环。 The code you are showing here should be ok. 您在此处显示的代码应该可以。
解决方案3
0 2014-11-12 04:05:25
The inprog error occurs sometimes when the you trigger code (such as a DOM event) programmatically (from within Angular), which is normally called by an external trigger. 当您以编程方式（从Angular内部）触发代码（例如DOM事件）时，有时会发生inprog错误，这通常由外部触发器调用。 This kind of error is normally complex to handle. 这种错误通常很难处理。 Your best bet is to use $timeout to wait for digest to complete and then do your tasks. 最好的选择是使用$ timeout等待摘要完成，然后执行任务。 I've modified your code to provide the intended functionality using $timeout. 我已经修改了您的代码，以使用$ timeout提供预期的功能。 Please take a look at below code. 请看下面的代码。 To know more about issues regarding inprog, see this link 要了解有关inprog的更多信息，请参阅此链接
https://docs.angularjs.org/error/ $rootScope/inprog https://docs.angularjs.org/error/ $ rootScope / inprog
HTML HTML
<body ng-controller="MainCtrl">
<div ng-repeat="option in options | orderBy:'-isSelected'">
<label>
<input type="checkbox" ng-click="option.selected()"> {{option.name}}
</label>
</div>
</body>
JS JS
var app = angular.module('plunker', []);
app.controller('MainCtrl', function($scope, $timeout) {
var myScope = $scope;
myScope.options = [];
for (var i = 1; i <= 10; i++) {
myScope.options.push(new function(){
var myself = this;
myself.name = 'Tag ' + i;
myself.isSelected = false;
myself.selected = function() {
$timeout(function() {
myself.isSelected = !myself.isSelected;
myScope.$apply();
}, 0, false);
};
});
}
});
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.