Skip to content

Instantly share code, notes, and snippets.

@sktbrt
Forked from compact/dropzone-directive.js
Last active April 16, 2016 10:09
Show Gist options
  • Select an option

  • Save sktbrt/d7a76097fcb73a87f5ee77314f44014b to your computer and use it in GitHub Desktop.

Select an option

Save sktbrt/d7a76097fcb73a87f5ee77314f44014b to your computer and use it in GitHub Desktop.
AngularJS directive for Dropzone.js
/**
* An AngularJS directive for Dropzone.js, http://www.dropzonejs.com/
*
* Usage:
*
* <div ng-app="app" ng-controller="SomeCtrl as ctrl">
* <button dropzone="ctrl.dropzoneConfig">
* Drag and drop files here or click to upload
* </button>
* </div>
*/
angular.module('dropzone', []).directive('dropzone', function () {
return {
scope: { config: '=dropzone' },
link: function (scope, element, attrs) {
var config, dropzone;
config = scope.config;
// create a Dropzone for the element with the given options
dropzone = new Dropzone(element[0], config.options);
// bind the given event handlers
angular.forEach(config.eventHandlers, function (handler, event) {
dropzone.on(event, handler);
});
}
};
});
angular.module('app', ['dropzone']);
angular.module('app').controller('SomeCtrl', function () {
this.dropzoneConfig = {
'options': { // passed into the Dropzone constructor
'url': 'upload.php'
},
'eventHandlers': {
'sending': function (file, xhr, formData) {
},
'success': function (file, response) {
}
}
};
});
@sktbrt
Copy link
Author

sktbrt commented Apr 16, 2016

For "Controller as"

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment