0

コントローラーで、変数「データ」をデフォルト値に設定しました。私の元のプロジェクトでは、CouchCornerを使用して CouchDB からデータをフェッチし、データを更新しました。

derictive 内で変数データを監視し、それに応じて要素を更新します。しかし、「$digest already in progress」という問題が発生したため、derective が正しく更新されませんでした。$digest の問題についてはすでに多くの情報を見つけましたが、私の問題に適合する答えは見つかりませんでした。

実際の CouchDB リクエストの代わりに $timeout を使用する次の jsFiddle を作成しました: 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 の衝突を回避するにはどうすればよいですか?

4

1 に答える 1

0

ここ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);
            });
        }
    };
});
于 2013-09-02T16:33:27.540 に答える