Working with angular 1.5 Component

Unlike directives, components do not have link function that fires up after all child directives have linked. But components have lifecycle hooks.

Use $onInit lifecycle hooks to set up options.

Use $postLink lifecycle hook to make use of dropzone interface variables. $postLink will invoke when all child constructors are instantiated and bindings are linked.

myNgApp.component('myComp', {
	template : '<ng-dropzone class="dropzone" options="$ctrl.dzOptions" callbacks="$ctrl.dzCallbacks" methods="$ctrl.dzMethods"></ng-dropzone>',
	controller : function(){
		var vm = this;

		// children yet not link
		vm.$onInit = function(){
			vm.dzOptions = {
				url : '/upload',
				acceptedFiles : 'image/jpeg, images/jpg, image/png',
				addRemoveLinks : true,
				dictDefaultMessage : 'Click to add or drop photos (10 max)',
				dictRemoveFile : 'Remove photo',
				dictResponseError : 'Could not upload this photo',
				paramName : 'photo',
				maxFilesize : '10',
				maxFiles : '10'
			};

			vm.dzCallbacks = {};
			vm.dzMethods = {};
		};

		// children are linked
		vm.$postLink = function(){
			var dz = vm.dzMethods.getDropzone();
			console.log(dz);
		}
	}
});

---

Preview