サービスデータのバインド、$ watchを実行して$ watchを実行するのに手間がかかる

Question

非常に単純なAngularJSアプリケーションをセットアップしようとしていますが、$watchと$applyを実行するのに問題があります。

私は（今のところ）私はJSONオブジェクト内の受信アレイの長さを表示したいです。私はウォッチャーをセットアップして、私のService-dataをバインドして$ applyコールを表示して置くように設定しましたが、何とかしてもこれはうまくいきません。 $apply()私の見解を取り外すとき

（それゆえ、私は他のすべてのようになって働くと仮定）更新しているが、それは以前の値を更新しています。

HTML：

<div ng-controller="scandataCtrl"> 
    {{scandata.length}} 
</div> 

Javascriptを：

app.controller('scandataCtrl',['$scope', 'DataHandler', function($scope, DataHandler) { 

    $scope.scandata = DataHandler.getScanData(); 

    $scope.$watch(
     function(){ 
      return DataHandler.getScanData(); 
     }, 
     function(newVal, oldVal){ 
      $scope.$apply(function(){ 
       $scope.scandata = DataHandler.getScanData(); 
      }); 
    }); 

}]); 


app.service('DataHandler', function() 
{ 
    var scanresult = []; 

    this.getScanData = function() 
    { 
     return scanresult; 
    }; 

    this.msgreceive = function(msg) 
    { 
     var msgobj = JSON.parse(msg); 
     switch (msgobj.MessageType) 
     { 
      case 'SCANRESULT': 
       scanresult = msgobj.MessageData.myArray; 
       break; 
      default: 
       alert("error: undefined message received") 
       break; 
     } 
    }; 
}); 

私は多くのことをグーグルが、それを把握coudn't。

Answer 1

あなたは$applyの代わりに$timeoutを使用する必要があります。

$scope.$watch(function(){ 
    return DataHandler.getScanData(); 
}, function(newVal, oldVal){ 
    $timeout(function(){ 
     $scope.scandata = DataHandler.getScanData(); 
    }); 
}); 

タイムアウトは、内部$applyを呼び出すが、ダイジェストの例外をスローしません安全な方法で進行にすでにあるだろう。