angular指令中已经附加了Dropzone

Getting error Dropzone already attached with angular Directives

本文关键字:Dropzone 指令 angular      更新时间:2023-09-26

我正在使用以下代码的下降区,但我得到错误,我试图调试它,但我无法解决这个行动plz指南

http://jsfiddle.net/anam123/rL6Bh/

 -------------------> "Error: Dropzone already attached.
  throw new Error("Dropzone already attached.");" 

代码:https://gist.github.com/compact/8118670

snippts:

 /**
 * An AngularJS directive for Dropzone.js, http://www.dropzonejs.com/
 * 
 * Usage:
 * 
 * <div ng-app="app" ng-controller="SomeCtrl">
 *   <button dropzone="dropzoneConfig">
 *     Drag and drop files here or click to upload
 *   </button>
 * </div>
 */
angular.module('dropzone', []).directive('dropzone', function () {
  return function (scope, element, attrs) {
    var config, dropzone;
    config = scope[attrs.dropzone];
    // create a Dropzone for the element with the given options
    dropzone = new Dropzone(element[0], config.options);
    // bind the given event handlers
    _.each(config.eventHandlers, function (handler, event) {
      dropzone.on(event, handler);
    });
  };
});
angular.module('app', ['dropzone']);
angular.module('app').controller('SomeCtrl', function ($scope) {
  $scope.dropzoneConfig = {
    'options': { // passed into the Dropzone constructor
      'url': 'upload.php'
    },
    'eventHandlers': {
      'sending': function (file, xhr, formData) {
      },
      'success': function (file, response) {
      }
    }
  };
});

使用以下代码设置解决问题。

所以你可以:

  1. 像这样全局关闭自动发现:Dropzone.autoDiscover = false;,或
  2. 为特定元素关闭自动发现,例如this: Dropzone.options.myAwesomeDropzone = false;

参考:
drop - zone

常见问题解答

我没有工作,所以我去了dropzone.js文件并改变了抛出错误的行(我认为在许多版本中它在426行):

if (this.element.dropzone) {
    throw new Error("Dropzone already attached.");
  }

所以我替换了

throw new Error("Dropzone already attached.");

return this.element.dropzone;

,它正在工作

Dropzone.autoDiscover = false;
$('#bannerupload').dropzone({
    url: "/upload",
    maxFilesize: 100,
    paramName: "file",
    maxThumbnailFilesize: 5,
    init: function() {      
      this.on('success', function(file, json) {       
        jQuery("input#mediaid").val(json);
      });
    }
  });

我面临同样的问题"Dropzone已经附加",因为我们在脚本中启用了myDropzone对象,并试图再次启用。

例如

if ($('#upl').attr('class')) {
var myDropzone = new Dropzone("#upl", {init: function () {

并再次尝试启用

 if (jQuery('#password').attr('save_profile')) {
  var myDropzone = new Dropzone("#upl", {init: function () {

与另一个动作。

请检查代码。

将创建dropzone代码放在try/catch块中

try{
 $('.dropzone').dropzone({
    url: '/upload'
  });
}
catch(error){
    console.log("Catching " + error);
}