danialfarid / ng-file-upload

Lightweight Angular directive to upload files with optional FileAPI shim for cross browser support
MIT License
7.87k stars 1.6k forks source link

When I send a file single file use sample code, ,i got a page reload #2146

Open kdhly opened 3 years ago

kdhly commented 3 years ago

When I send a file single file use sample code,i got a page reload,, I want to stay on the current page what should I do? thank you.

mahendralife commented 3 years ago

can you share your code?

kdhly commented 3 years ago

onClick(e) { const fileUpload = this.fileUpload.nativeElement; fileUpload.onchange = (e) => { for (let index = 0; index < fileUpload.files.length; index++) { const file = fileUpload.files[index]; this.files.push({ data: file, inProgress: false, progress: 0}); } this.uploadFiles(); }; fileUpload.click(); }

private uploadFiles() { this.fileUpload.nativeElement.value = ''; this.files.forEach(file => { this.uploadFile(file); }); }

uploadFile(file) { const formData = new FormData(); formData.append('file', file.data); formData.append('url', "http://localhost:4200/api/upload"); Upload.http({ url: 'http://localhost:4200/api/upload', data: file })

html: <input type="file" #fileUpload id="fileUpload" name="fileUpload" multiple="multiple" accept="image/*" style="display:none;" />

result: The file was uploaded, but the page was reload.

thank you!

kdhly commented 3 years ago

thank you.