0

blueimp-fileuploadを使用するangularでディレクティブを作成しました。 requireJsオプティマイザを使用しない限り、コードは正常に動作します。状態変化後の削除のスタックが異なるrequireJSオプティマイザ後の角度削除

Error: cannot call methods on fileupload prior to initialization; attempted to call method 'destroy'

requireJs後:我々はrequireJsオプティマイザを実行した後しかし、我々は次のエラーを取得します。

Wihtoutが、それは一度だけ、この関数を呼び出しRequireJs:

jQuery.cleanData = function(elems) { 
     var events; 
     for (var i = 0, elem; (elem = elems[i]) != null; i++) { 
     events = jQuery._data(elem, "events"); 
     if (events && events.$destroy) { 
      jQuery(elem).triggerHandler('$destroy'); 
     } 
     } 
     originalCleanData(elems); 
    }; 

しかしRequireJsオプティマイザの後に、それはjqueryの-ui.jsとjQuery、一度jquery.jsで、関数cleanData 3回(ただし、異なる実装を呼び出します。-ui-カスタム

requireJsオプティマイザでは、それが(第1の二回と呼ばれ、1秒に1回れる)は、この2つの関数を呼び出します。

$.cleanData = function(elems) { 
    for (var i = 0, elem; (elem = elems[i]) != null ; i++) { 
      try { 
      $(elem).triggerHandler("remove"); 
      // http://bugs.jquery.com/ticket/8235 
      } catch (e) {} 
     } 
     _cleanData(elems); 
    }; 

    jQuery.cleanData = function(elems) { 
     var events; 
     for (var i = 0, elem; (elem = elems[i]) != null; i++) { 
     events = jQuery._data(elem, "events"); 
     if (events && events.$destroy) { 
      jQuery(elem).triggerHandler('$destroy'); 
     } 
     } 
     originalCleanData(elems); 
    }; 

私は2つを削除した場合jQuery.cleanDataの実装は、requireJsの後で動作しますが、解決策ではありません。この問題は、角度の状態が変化した後に発生します。これは例外のために実行が終了せず、その後混乱します。この問題を引き起こす可能性がありますし、我々はそれを修正するために何ができるのは何

 define('misc/directives/fileUpload', ['../app'], function(app) { 
      return app.directive('fileUpload', function() { 
       return { 
        restrict: 'A', 
        template: '<input type="file" name="files[]">', 
        scope: { 
         onAdd: '=onAdd', 
         options: '=options' 
        }, 
        link: function($scope, $element, $attrs) { 
         if ($attrs.multiple != null) { 
          $element.find('input').attr('multiple', 'multiple'); 
         } 
         return $element.fileupload(angular.extend({ 
          autoUpload: false 
         }, $scope.options)).on('fileuploadprocessdone', function(e, data) { 
          return $scope.$apply($scope.onAdd(data.files)); 
         }).on('$destroy', function() { 
          return $element.fileupload('destroy'); 
         }); 
        } 
       }; 
      }).directive('fileUploadPreview', function() { 
       return { 
        restrict: 'A', 
        scope: { 
         uploadFile: '=uploadFile' 
        }, 
        link: function($scope, $element, $attrs) { 
         return $scope.$watch('uploadFile', function(file) { 
          $element.empty(); 
          if (file != null ? file.preview : void 0) { 
           return $element.append(file.preview); 
          } 
         }); 
        } 
       }; 
      }); 
     }); 

:ここ

は角度指令のjsのでしょうか? return $ element.fileupload( 'destroy')の呼び出しです。必要? cleanDataは内部jqueryメソッドであると思われます。ここでは、それらが何であるか、またはここにあるかどうかを中継する必要があります。see this question。何か案は ?

についてPeter。

答えて

0

私が見る限りでは、あなたが言ったように、ここからdestroyを呼び出す必要はありません.JQueryは、要素がDOMから削除されるとすぐに処理しています。

Angularのシナリオが部分的な変更などの場合、その場合もあります。

このエラーメッセージは、以前に既に削除されているため、要素にファイルアップロードがもう適用されていないことを示しています。

これまでの私の前提です。私の側から


さらに二つのコメント:

  • blueimpはすでに独自にそれを行う際に、あなた自身の角のディレクティブを作成した理由は何でしたか?

  • 動作が最適化されたモードと最適化されていないモードで同じである必要があるため、requirejsセットアップを必ず確認します。

関連する問題