ディープ$オブジェクト配列の監視で不正な呼び出しが返される

Question

私はディレクティブを持っています。オブジェクトの配列であるスコープのメンバーの1つを監視しようとしています。

 <div ng-repeat="image in images track by $index" class="cr-form image-block-holder clearfix"> 
      <div ng-class="images[$index].imageFile == undefined ? 'image-upload' : 'image-upload image-active'"> 
       <div class="cr-file-upload" style="position: relative"> 
        <input id="crChooseFile" type="file" ngf-select ng-model="images[$index].imageFile" ngf-multiple="false" ng-attr-accept="image/*" 
          class="form-control ng-pristine ng-invalid ng-invalid-required ng-touched" name="uploadField" image="imageFile" /> 

       </div> 
       <div class="cr-edit-business-profile"> 
        <div class="cr-business-logo"> 
         <img class="cr-profile-logo-img" ng-show="images[$index].imageFile" ng-src="{{images[$index].imageFile.url}}" type="{{images[$index].imageFile.file.type}}" /> 
         <img ng-show="images[$index].imageFile == null && images[$index].logo" ng-src="{{images[$index].logo}}" type="image/png" /> 
        </div> 
       </div> 
       <div class="image-label"> 
        <label>Browse</label> <br /> 
       </div> 
      </div> 

      <div class="form-elements"> 
       <div class="input-inner"> 
        <textarea type="text" ng-model="images[$index].caption" ng-keyup="setCaption($index)" placeholder="Add Caption"></textarea> 
       </div> 
      </div> 
     </div> 

そして、これが私の指示で時計です：

   scope.$watch(function() { return scope.images }, function (newValue, oldValue) { 
        if (newValue && oldValue) { 
         $timeout(function() { 
          var changedIndex = -1; 
          for (var i = 0; i < scope.content.noOfImages && changedIndex == -1; i++) { 
           if (isDifferentImage(newValue[i].imageFile, oldValue[i].imageFile)) 
            changedIndex = i; 
          } 
          if (changedIndex == -1) 
           return; 
          scope.content.images[changedIndex].photo = newValue[changedIndex].imageFile; 

         }, 0, false); 
        } 
       }, true); 

私もそれはそれはどちらかクビにしない深い時計なしで、解雇されない、watchCollectionてみました。 ng-changeイベントはそのトリックをやっていないようです。オブジェクト配列の$ watchが深刻な呼び出しを返す

どのようにすればいいですか？私は角度1.4.5を使用しています

Answer 1

これはimagesの配列にFileオブジェクトが含まれているためです。

次は$watchマニュアルに記載されています：

これはあるか が原因angular.copyとの制限のためにFileオブジェクトを含むオブジェクトの変更を監視するために使用すべきではありません。

別の方法で解決する必要があります。代わりに、ファイル名の配列を見て例えば

（または name + lastModified nameをご利用の場合のために十分でない場合）：

$scope.$watch(function() { 
    return JSON.stringify($scope.files); 
}, function() { 

    // Code 

}); 

：

$scope.$watch(function() { 
    return $scope.files.map(function(file) { 
    return file && file.name; 
    }); 
}, function() { 

    // Code 

}, true); 

が同様に使用され、次の見たことがあります