Чтобы изменить ситуацию, вам необходимо внести небольшую модификацию в dropzone.js, но в остальном это просто директива.
Моя dropzone теперь повторяет (бесконечно, но я исправлю это позже), пока это не удастся. Требуется немного больше работы, чтобы сбросить индикаторы выполнения, но этого должно быть достаточно, чтобы доставить вас куда-нибудь (если вам все еще нужно это делать).
Редактирование в dropzone.js является (в Приукрашена версии):
success: function(file) {
file.previewElement.classList.remove("dz-error");
return file.previewElement.classList.add("dz-success");
}
Где я добавил удалить строку. Это изменяет Xs на отметки, когда файл успешно загружается.
Угловая директива следующим образом:
.directive('dropZone', function($rootScope) {
return function ($scope, element, attr) {
var myDropZone = element.dropzone({
url: "api/ImageUpload",
maxFilesize: 100,
paramName: "uploadfile",
maxThumbnailFilesize: 5,
autoProcessQueue: false,
parallelUploads: 99999,
uploadMultiple: false,
// this is my identifier so my backend can index the images together
params: {identifier: $scope.identifier},
// I seem to need to do this when a file is added, otherwise it doesn't update
init: function(){this.on("addedfile", function(file){$rootScope.$digest();})}
});
// grabbing the dropzone object and putting it somewhere the controller can reach it
$scope.dropZone = myDropZone.context.dropzone;
// what we use to work out if we're _really_ complete
$scope.errors = [];
// here is our retry mechanism
myDropZone.context.dropzone.addEventListener("error", function(file,errorMessage,xhr)
{
// log our failure so we don't accidentally complete
$scope.errors.push(file.name);
// retry!
myDropZone.context.dropzone.uploadFile(file);
});
myDropZone.context.dropzone.addEventListener("success", function(file,errorMessage,xhr)
{
// remove from the error list once "success" (_not_ "complete")
$scope.errors.splice($scope.errors.indexOf(file.name), 1);
});
// this gets called multiple times because of our "retry"
myDropZone.context.dropzone.addEventListener("queuecomplete", function()
{
// if we're here AND have no errors we're done
if($scope.errors.length == 0)
{
// this is my callback to the controller to state we're all done
$scope.uploadComplete();
}
});
};
})
не уверен, что если все, что myDropZone.context.dropZone материал нужно, я своего рода сосать яваскрипта и тратить много своего времени console.logging() объектов и их изучение в отладчик. Вот где я нашел компонент dropzone, возможно, есть более простой способ?
В целом это хорошо выглядит. Вам не нужно (и не следует) изменять dropzone.js, хотя! Просто зарегистрируйтесь на событие успеха в функции init и добавьте свой вызов там: 'this.on (« success », function (file) {file.previewElement.classList.remove (« dz-error »);}); 'Вы также должны добавить некоторый обратный отсчет, чтобы файлы не повторялись бесконечно. – enyo