Question

我在AngularJS应用程序中遇到一个奇怪的问题。该错误是经典的$digest already in process错误。我已经用谷歌搜索并研究了类似的问题，但是没有一个建议的解决方案起作用。该错误发生在子组件中。子组件基本上只是带有某些样式的常规文本输入的包装。子组件的ng-model被绑定到item作为输入传递。输入为focused和blurred时，子组件ouptus发生事件。组件层次结构如下：父组件是模态，子组件是文本输入。上级组件（模态）可以通过ESC键关闭。如果我打开模式，选择输入（不输入任何内容），然后通过ESC键将其关闭，则会出现错误。

这是子组件模板

<div class="input-group has-feedback"'
     ng-class="{'has-error' : vm.item.errors.length > 0 ,
                'has-success' : vm.item.isFulfilled}">
        <div class="input-group-addon">
            <i class="fa fa-asterisk"></i>
        </div>
            <input
            ng-model="vm.item.pendingBarcode"
            type="text"/>
</div>

这是子组件JS

.component('rfidInput', {
        templateUrl: 
'swipeables/templates/swipeables.rfidReader.tpl.html',
        controllerAs: 'vm',
        bindings: {
            item: '<',
            id: '<',
            onFocus: '&',
            onBlur: '&',
            focus: '<'
        },
        controller: function() {

            this.onInputFocus = function() {
                if(typeof this.onFocus === 'function') {
                    this.onFocus({index:this.id})
                }
            }

            this.onInputBlur = function() {
                if(typeof this.onBlur === 'function') {
                    this.onBlur({item:this.item});
                }
            }
        }
    })

我实际上将子组件的模板修改为仅ng-model到ng-blur和ng-focus绑定，但是我删除了这些绑定以追溯源代码。

父模板在这里使用子模板的方式

<rfid-input on-blur="fulfill(item)" focus="currentFocusedScanIndex"
            on-focus="onScanFocus(index)" item="item" id="$index">
</rfid-input>

现在非常有趣的是，仅当我单击输入然后关闭模式时才会发生错误。如果我不选择输入就打开模态并再次关闭它，就不会发生错误。

我很茫然，不知道如何使它工作。我还尝试了$timeout解决方案，以便在$超时后触发onFocus和onBlur，以免干扰当前的$ digest周期。

任何帮助或有关解决此问题的建议将不胜感激。如果还有关于如何更改该子组件的建议，那也很好。

Answer 1

从文档中：

诊断此错误

当您收到此错误时，诊断问题原因可能相当艰巨。最好的措施是调查错误中的堆栈跟踪。您需要查找已调用$apply或$digest的地方，并找到发生这种情况的上下文。

应该打两个电话：

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

第二个呼叫是错误的$apply / $digest，这是要调查的那个。

确定了此调用后，便会逐步向上查看问题所在。

如果在您的应用程序代码中进行了第二次调用，那么您应该查看为什么从$apply / $digest中调用此代码的原因。这可能是一个简单的疏忽，或者可能与前面所述的同步/异步情况相符。

如果第二次调用是在AngularJS指令内进行的，则很可能与前面描述的第二个编程事件触发方案相匹配。在这种情况下，您可能需要进一步查看树，以首先发现触发事件的原因

有关更多信息，请参见AngularJS Error Reference - inprog - Diagnosing This Error。

子组件销毁后，摘要已在进行中

1 个答案:

诊断此错误