Question

我有一个这样定义的SELECT元素：

<select class="form-control ng-pristine ng-untouched ng-valid" 
    ng-options="composer.Name for composer in composerList track by composer.Name | orderBy:'Name'" 
    ng-model="selectedComposer">

composerList和selectedComposer在控制器中的创建方式如下：

AlbumService.getComposerList().then(function (data) {
    $scope.composerList = data; //data comes from a REST response in the service
    $scope.selectedComposer = $scope.album.Composer;
});

composer的结构只是Id和Name属性，但将来会扩展。

问题出在上面的SELECT元素上。它引发了许多10 $digest() iterations reached. Aborting!错误。

    Error: [$rootScope:infdig] 10 $digest() iterations reached. Aborting!
Watchers fired in the last 5 iterations: [[{"msg":"fn: function() { return ngOptions.getTrackByValue(ngModelCtrl.$viewValue); }","newVal":["J","o","h","n"," ","W","i","l","i","a","m","s"],"oldVal":["J","o","h","n"," ","W","i","l","i","a","m","s"]},{"msg":"fn: interceptedExpression","newVal":138,"oldVal":121}],[{"msg":"fn: function() { return ngOptions.getTrackByValue(ngModelCtrl.$viewValue); }","newVal":["J","o","h","n"," ","W","i","l","i","a","m","s"],"oldVal":"..."},{"msg":"fn: interceptedExpression","newVal":155,"oldVal":138}],[{"msg":"fn: function() { return ngOptions.getTrackByValue(ngModelCtrl.$viewValue); }","newVal":["J","o","h","n"," ","W","i","l","i","a","m","s"],"oldVal":"..."},{"msg":"fn: interceptedExpression","newVal":172,"oldVal":155}],[{"msg":"fn: function() { return ngOptions.getTrackByValue(ngModelCtrl.$viewValue); }","newVal":["J","o","h","n"," ","W","i","l","i","a","m","s"],"oldVal":"..."},{"msg":"fn: interceptedExpression","newVal":189,"oldVal":172}],[{"msg":"fn: function() { return ngOptions.getTrackByValue(ngModelCtrl.$viewValue); }","newVal":["J","o","h","n"," ","W","i","l","i","a","m","s"],"oldVal":"..."},{"msg":"fn: interceptedExpression","newVal":206,"oldVal":189}]]
https://errors.angularjs.org/1.7.2/$rootScope/infdig?p0=10&p1=%5B%5B%7B%22msg%22%3A%22fn%3A%20function()%20%7B%20return%20ngOptions.getTrackByValue(ngModelCtrl.%24viewValue)%3B%20%7D%22%2C%22newVal%22%3A%5B%22J%22%2C%22o%22%2C%22h%22%2C%22n%22%2C%22%20%22%2C%22W%22%2C%22i%22%2C%22l%22%2C%22i%22%2C%22a%22%2C%22m%22%2C%22s%22%5D%2C%22oldVal%22%3A%5B%22J%22%2C%22o%22%2C%22h%22%2C%22n%22%2C%22%20%22%2C%22W%22%2C%22i%22%2C%22l%22%2C%22i%22%2C%22a%22%2C%22m%22%2C%22s%22%5D%7D%2C%7B%22msg%22%3A%22fn%3A%20interceptedExpression%22%2C%22newVal%22%3A138%2C%22oldVal%22%3A121%7D%5D%2C%5B%7B%22msg%22%3A%22fn%3A%20function()%20%7B%20return%20ngOptions.getTrackByValue(ngModelCtrl.%24viewValue)%3B%20%7D%22%2C%22newVal%22%3A%5B%22J%22%2C%22o%22%2C%22h%22%2C%22n%22%2C%22%20%22%2C%22W%22%2C%22i%22%2C%22l%22%2C%22i%22%2C%22a%22%2C%22m%22%2C%22s%22%5D%2C%22oldVal%22%3A%22...%22%7D%2C%7B%22msg%22%3A%22fn%3A%20interceptedExpression%22%2C%22newVal%22%3A155%2C%22oldVal%22%3A138%7D%5D%2C%5B%7B%22msg%22%3A%22fn%3A%20function()%20%7B%20return%20ngOptions.getTrackByValue(ngModelCtrl.%24viewValue)%3B%20%7D%22%2C%22newVal%22%3A%5B%22J%22%2C%22o%22%2C%22h%22%2C%22n%22%2C%22%20%22%2C%22W%22%2C%22i%22%2C%22l%22%2C%22i%22%2C%22a%22%2C%22m%22%2C%22s%22%5D%2C%22oldVal%22%3A%22...%22%7D%2C%7B%22msg%22%3A%22fn%3A%20interceptedExpression%22%2C%22newVal%22%3A172%2C%22oldVal%22%3A155%7D%5D%2C%5B%7B%22msg%22%3A%22fn%3A%20function()%20%7B%20return%20ngOptions.getTrackByValue(ngModelCtrl.%24viewValue)%3B%20%7D%22%2C%22newVal%22%3A%5B%22J%22%2C%22o%22%2C%22h%22%2C%22n%22%2C%22%20%22%2C%22W%22%2C%22i%22%2C%22l%22%2C%22i%22%2C%22a%22%2C%22m%22%2C%22s%22%5D%2C%22oldVal%22%3A%22...%22%7D%2C%7B%22msg%22%3A%22fn%3A%20interceptedExpression%22%2C%22newVal%22%3A189%2C%22oldVal%22%3A172%7D%5D%2C%5B%7B%22msg%22%3A%22fn%3A%20function()%20%7B%20return%20ngOptions.getTrackByValue(ngModelCtrl.%24viewValue)%3B%20%7D%22%2C%22newVal%22%3A%5B%22J%22%2C%22o%22%2C%22h%22%2C%22n%22%2C%22%20%22%2C%22W%22%2C%22i%22%2C%22l%22%2C%22i%22%2C%22a%22%2C%22m%22%2C%22s%22%5D%2C%22oldVal%22%3A%22...%22%7D%2C%7B%22msg%22%3A%22fn%3A%20interceptedExpression%22%2C%22newVal%22%3A206%2C%22oldVal%22%3A189%7D%5D%5D
    at angular.js:138
    at Scope.$digest (angular.js:18625)
    at Scope.$apply (angular.js:18945)
    at done (angular.js:12799)
    at completeRequest (angular.js:13056)
    at XMLHttpRequest.requestLoaded (angular.js:12961)

我不知道为什么会出现这些错误。无论解决方案是什么，我都需要保留selectedComposer变量中的album变量，而我希望将SELECT保留为作曲家对象列表而不是字符串的列表。作曲家的名字。

感谢您的帮助。

Answer 1

对于将来可能还会看到我的问题的其他人，我做了更多的研究，解决方案很简单。 ng-options部分的跟踪应该移到字符串的末尾。

ng-options="composer.Name for composer in composerList | orderBy:'Name' track by composer.Name"

选择ng-options会导致$ digest（）迭代次数达到错误

1 个答案: