获取错误 Dropzone 已经附加了角度指令答案

【问题标题】：Getting error Dropzone already attached with angular Directives获取错误 Dropzone 已经附加了角度指令
【发布时间】：2014-07-29 20:52:42
【问题描述】：

我正在使用以下代码作为放置区，但出现错误，我尝试调试它，但我无法解决此操作请指导

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

 -------------------> "Error: Dropzone already attached.

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

代码::

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

片段：

 /**
 * 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) {
      }
    }
  };
});

【问题讨论】：

Dropzone.instances 有 dropzone 附加实例。您可以检查它们。

标签： javascript angularjs dropzone.js

【解决方案1】：

没有什么对我有用，所以我转到 dropzone.js 文件并更改引发错误的行（我认为在许多版本中它位于第 426 行）：

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

所以我替换

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

与

return this.element.dropzone;

它正在工作

【讨论】：

【解决方案2】：

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

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

【讨论】：

【解决方案3】：

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.autoDiscover = false;是在其余代码之前需要的全部内容。
当然可行，我自己测试并实现了这个
@ProgrammerCk - 是的，谁会怀疑一个拥有 16 名声望和不正确的大小写和标点符号的人？

【解决方案4】：

我遇到了同样的问题“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 () {

用另一个动作。

请检查您的代码。

【讨论】：

【解决方案5】：

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

所以你可以：

像这样在全局范围内关闭自动发现：Dropzone.autoDiscover = false;，或者
关闭特定元素的自动发现，例如这个：Dropzone.options.myAwesomeDropzone = false;

参考：
FAQ on dropzone

【讨论】：

我面临同样的问题...我尝试了Dropzone.autoDiscover = false; 和其他选项...但我遇到了同样的错误
我最终放弃了。刚刚注释掉了dropzone.js中的函数Dropzone._autoDiscoverFunction = function () { if (Dropzone.autoDiscover) { return Dropzone.discover(); } };
这应该是正确的答案。我遇到了类似的问题，并在每个 dropzone 实例解决它之前放置了这个函数。