DropzoneJs 成功和错误回调
DropzoneJs success and error callback
我正在构建一个 AngularJs 应用程序,我正在使用 DropzoneJs 的 dropzone。我需要使用成功和错误回调,因为我必须访问服务器响应。我遇到一个问题,如果我使用回调,previewTemplate 会发生变化...那么,我可以在回调中更改 previewTemplate 吗?
如果我不使用回调,这里是结果模板和代码:
var myDropzone = $("#storageDropzone").dropzone({
url: firstUrl,
});
如果我使用回调 "tick" 或 "cross" 不显示:
var myDropzone = $("#storageDropzone").dropzone({
url: firstUrl,
error: function (file, response) {
console.log("Erro");
console.log(response);
},
success: function (file, response) {
console.log("Sucesso");
console.log(response);
},
complete: function (file) {
console.log("Complete");
}
});
那么,我可以更改回调中的 previewTemplate 吗?或者简单地说,保留现有的那个?
所以,这是我找到的解决方法...
我没有使用回调,而是对 init 函数进行了更改。虽然这个答案不能让我满意,但这是我现在能做的最好的...如果有人能解释为什么它在 init 上工作而不是作为回调,请随时回答。
这是解决方案:
var myDropzone = $("#storageDropzone").dropzone({
init: function () {
this.on("processing", function (file) {
$scope.$apply($scope.working = true);
this.options.url = lastUrl;
$scope.$apply($scope.processing = true);
});
this.on("success", function (file, response) {
console.log("sucesso");
var ficheiro = { nome: file.name, link: response[0] };
$scope.$apply($scope.uploadedFiles.push(ficheiro));
});
this.on("error", function (file, error, xhr) {
var ficheiro = { nome: file.name, status: xhr.status, statusText: xhr.statusText, erro: error.message };
$scope.$apply($scope.errorFiles.push(ficheiro));
});
}
我认为发生的事情是,由于您正在覆盖默认的 DropZone "error" 和 "success" 回调函数,因此 "tick" 和 "cross" 不会在文件上传磁贴。不是模板变了,而是变了。您正在覆盖默认的 DropZone 错误和成功行为。要显示 "tick" 和 "cross",您需要将代码从默认的 DropZone 错误和成功回调函数复制到您的函数中,然后实现您需要的任何额外或更改的行为。
我正在构建一个 AngularJs 应用程序,我正在使用 DropzoneJs 的 dropzone。我需要使用成功和错误回调,因为我必须访问服务器响应。我遇到一个问题,如果我使用回调,previewTemplate 会发生变化...那么,我可以在回调中更改 previewTemplate 吗?
如果我不使用回调,这里是结果模板和代码:
var myDropzone = $("#storageDropzone").dropzone({
url: firstUrl,
});
如果我使用回调 "tick" 或 "cross" 不显示:
var myDropzone = $("#storageDropzone").dropzone({
url: firstUrl,
error: function (file, response) {
console.log("Erro");
console.log(response);
},
success: function (file, response) {
console.log("Sucesso");
console.log(response);
},
complete: function (file) {
console.log("Complete");
}
});
那么,我可以更改回调中的 previewTemplate 吗?或者简单地说,保留现有的那个?
所以,这是我找到的解决方法...
我没有使用回调,而是对 init 函数进行了更改。虽然这个答案不能让我满意,但这是我现在能做的最好的...如果有人能解释为什么它在 init 上工作而不是作为回调,请随时回答。
这是解决方案:
var myDropzone = $("#storageDropzone").dropzone({
init: function () {
this.on("processing", function (file) {
$scope.$apply($scope.working = true);
this.options.url = lastUrl;
$scope.$apply($scope.processing = true);
});
this.on("success", function (file, response) {
console.log("sucesso");
var ficheiro = { nome: file.name, link: response[0] };
$scope.$apply($scope.uploadedFiles.push(ficheiro));
});
this.on("error", function (file, error, xhr) {
var ficheiro = { nome: file.name, status: xhr.status, statusText: xhr.statusText, erro: error.message };
$scope.$apply($scope.errorFiles.push(ficheiro));
});
}
我认为发生的事情是,由于您正在覆盖默认的 DropZone "error" 和 "success" 回调函数,因此 "tick" 和 "cross" 不会在文件上传磁贴。不是模板变了,而是变了。您正在覆盖默认的 DropZone 错误和成功行为。要显示 "tick" 和 "cross",您需要将代码从默认的 DropZone 错误和成功回调函数复制到您的函数中,然后实现您需要的任何额外或更改的行为。