由于“$消化已经在进行中”;

Directive is not updated due to "$digest already in progress"

本文关键字:进行中 由于      更新时间:2023-09-26

在我的控制器中,我将变量"data"设置为默认值。在我最初的项目中,我使用CouchCorner从CouchDB中获取数据并更新数据。

在Derive中,我观察变量数据并相应地更新元素。然而,我遇到了"$digest ready in progress"的问题,这导致deractive没有正确更新。我已经找到了很多关于$digest问题的信息,但我找不到任何适合我的问题的答案。

我创建了以下jsFiddle,它使用$timeout而不是实际的CouchDB请求:http://jsfiddle.net/cwesM/4/

var App = angular.module('myApp', []);
function Ctrl($scope, $timeout) {
$scope.data="Initial";
$timeout(function(){
    $scope.data="Updated"}, 1)
}
App.directive('chart', function(){
    return{
        restrict: 'E',
        link: function(scope, elem, attrs){
            scope.$watch(attrs.ngModel, function(v){
                alert(v)
                elem.html("Data="+v);
            });
        }
   };
});

脚本在1ms后将"data"的初始值更改为"Updated"。但是,尽管执行了$watch函数,但该指令不会更新。有趣的是,如果我删除alert(),一切都会按预期进行。

如何避免$digest的冲突?

您可以使用stackoverflow.com/a/17510699上发布的解决方案(答案由@Dor Cohen回答)。

我帮你把它和你当前的代码放在一起。

var App = angular.module('myApp', []);
function Ctrl($scope, $timeout) {
    $scope.data = "Initial";
    $timeout(function () {
        $scope.data = "Updated"
    }, 1);
    $scope.alert = function (info) {
        alert(info);
    }
    $scope.safeApply = function (fn) {
        var phase = this.$root.$$phase;
        if (phase == '$apply' || phase == '$digest') {
            if (fn && (typeof (fn) === 'function')) {
                fn();
            }
        } else {
            this.$apply(fn);
        }
    };
}
App.directive('chart', function () {
    return {
        restrict: 'E',
        link: function (scope, elem, attrs) {
            scope.$watch(attrs.ngModel, function (v) {
                scope.safeApply(function () {
                    alert(v);
                });
                elem.html("Data=" + v);
            });
        }
    };
});