从 v1.2 迁移到 v1.6 后，从下拉列表中选择一个值时出现“错误：[$rootScope:inprog] $apply already in progress”

Question

将我们的 AngularJS 应用程序从 v1.2.9 迁移到 v1.6.9 后，每当我点击任何下拉选项时，我都会在开发者控制台中收到错误提示

'错误：[$rootScope:inprog] $apply 已经在进行中'

我尝试使用 $timeout 解决方案，它解决了某些情况下的问题（使用 $apply 的情况）。但是，当我单击下拉选项时，会出现此特定问题。我没有在我的代码中的任何地方调用 $apply 。我也尝试在 select 标签中使用 ng-options，但问题仍然存在。

Select tag that gives issue:
<select name="task" id="task" ng-model="search.task">
    <option data-ng-repeat="each in taskList" value="{{each.id}}"
            ng-selected="each.id==search.task">
      {{each.taskName}}
    </option>
</select>

Code changes after using ng-options:
<select ng-model="search.task" ng-options="each for each in taskList">
    <option value="">Task Type</option>
</select>

Please follow link for complete error stack

错误：[$rootScope:inprog] $apply 已经在进行中 http://errors.angularjs.org/1.6.9/$rootScope/inprog?p0=%24apply

如何解决此错误？非常感谢任何帮助/指针。

Answer 1

不要将ngSelected 与ngModel 一起使用¹

<select name="task" id="task" ng-model="search.task">
    <option data-ng-repeat="each in taskList" value="{{each.id}}"
            ̶n̶g̶-̶s̶e̶l̶e̶c̶t̶e̶d̶=̶"̶e̶a̶c̶h̶.̶i̶d̶=̶=̶s̶e̶a̶r̶c̶h̶.̶t̶a̶s̶k̶"̶ >
      {{each.taskName}}
    </option>
</select>

来自文档：

注意：ngSelected 不与select 和ngModel 指令交互，它只在元素上设置selected 属性。如果您在选择上使用ngModel，则不应在选项上使用ngSelected，因为ngModel 将设置选择值和选定选项。

——AngularJS ng-selected Directive API Reference

查看其他文档：

• Using ng-repeat to generate select options
• Using select with ng-options and setting a default value

查看 Stackoverflow：

• Using ng-repeat to generate select options (with Demo)

---

诊断错误：$rootScope:inprog 操作已在进行中²

当您收到此错误时，诊断问题的原因可能会相当令人生畏。最好的做法是从错误中调查堆栈跟踪。您需要查找调用了$apply 或$digest 的位置，并找到发生这种情况的上下文。

应该有两个调用：

• 第一个调用是好的$apply/$digest，通常会由调用堆栈顶部附近的某个事件触发。

• 第二个电话是坏的$apply/$digest，这是要调查的。

一旦您确定了这个调用，您就可以在堆栈中查找问题所在。

如果在您的应用程序代码中进行了第二次调用，那么您应该查看为什么从 $apply/$digest 中调用了此代码。这可能是一个简单的疏忽，也可能适合前面描述的同步/异步场景。

如果第二次调用是在 AngularJS 指令中进行的，那么它很可能与前面描述的第二个编程事件触发场景相匹配。在这种情况下，您可能需要进一步向上查找触发事件的原因。

欲了解更多信息，请参阅AngularJS Error Reference - $rootScope/inprog - Diagnosing This Error

另见，

• AngularJS Developer Guide (V1.1) Runtime Concepts

• AngularJS $rootScope/Scope API Reference