Dropzone is not a constructor

[shadrackkip]

i get above error,i cant figure out where could be the problem

[thatisuday]

If you ware using Dropzone with npm or webpack, please use this package https://www.npmjs.com/package/angular2-dropzone-wrapper

[drewpayment]

Is this not for AngularJS? That link is for Angular 2...

Are you interested in a pull request if I convert this to TypeScript?

[sebk69]

I have the same issue on AngularJS.

shadrackkip : Have you solved your problem ?

[sebk69]

Found solution for me : the jquery dropzone must be instanciated before your AngularJS vendor

[jmahicks]

@sebk69 can you provide an example of instantiating your jquery dropzone before your AngularJS vendor?

[zulander1]

@jmahicks You need add the js file like this

<!--Drop Zone-->
<script src="~/js/plugin/dropzone/dropzone.min.js"></script>

<!--Angular Js-->
<script src="~/js/plugin/angular/angular.min.js"></script>

[saferodrigo]

I just added dropzonejs (www.dropzonejs.com) to my yarn/bower and loaded the dropzone/dist/dropzone files into application.js and application.css before the ng-dropzone files and it worked. I didn't need to create an instance while loading the screen. Example: package.json:

    "dropzone": "^ 5.5.0",
    "ngdropzone": "^ 2.0.2"

application.js

  // = require dropzone / dist / dropzone
  // = require ngdropzone / dist / ng-dropzone
  // = require ngdropzone / dist / ng-dropzone.min

application.css

   * = require dropzone / dist / dropzone
   * = require ngdropzone / dist / ng-dropzone

app.js (angular.module)

angular.module ('app', [
  'thatisuday.dropzone'
]

on your controller js

 vm.dropzoneOptions = {
      url: '/ api / admin / galleries / save-images? gallery_id =' + vm.galeria.id,
      paramName: 'file',
      acceptedFiles: 'image / *',
      addRemoveLinks: true
    }

    vm.dropzoneCallbacks = {
      'addedfile': function (file) {
        console.log ('callback file', file)
      // $ scope.newFile = file
      },
      'success': function (file, xhr) {
        console.log (file, xhr)
      }
    }

    vm.dropzoneMethods = {}

    function removeFile () {
      console.log ('VM and SCOPE', vm, $ scope)
    // $ scope.dzMethods.removeFile ($ scope.newFile); // We got $ scope.newFile from 'addedfile' event callback
    }

in your html file

<div id = "myDropzone" class = "grid-12 form dropzone" options = "vm.dropzoneOptions"
                    callbacks = "vm.dropzoneCallbacks" methods = "vm.dropzoneMethods" ng-dropzone> </div>