ngx file drop allow only image or pdf

Solutions on MaxInterview for ngx file drop allow only image or pdf by the best coders in the world

showing results for - "ngx file drop allow only image or pdf"
Ben
23 Feb 2017
1//trick for max file size and file type check in ngx-file-drop
2public dropped(files: NgxFileDropEntry[]) {
3    if (files.length > 6) {
4      this.toastr.error("Cannot add more than 6 Files at a time.")
5    } else {
6      // this.files = files;
7      for (const droppedFile of files) {
8
9        // Is it a file?
10        if (droppedFile.fileEntry.isFile && this.isFileAllowed(droppedFile.fileEntry.name)) {
11
12          const fileEntry = droppedFile.fileEntry as FileSystemFileEntry;
13          fileEntry.file((file: File) => {
14
15            if (this.isFileSizeAllowed(file.size)) {
16              //files array is used to display
17              //the files to the user which will be uploaded
18              this.files.push(droppedFile);
19              if (this.files.length < 6) {
20
21                // Here you can access the real file
22                console.log(droppedFile.relativePath, file);
23                this.formData.append(`img${this.index}`, file, droppedFile.relativePath);
24                this.index++;
25
26                /**
27                // You could upload it like this:
28                const formData = new FormData()
29                formData.append('logo', file, relativePath)
30       
31                // Headers
32                const headers = new HttpHeaders({
33                  'security-token': 'mytoken'
34                })
35       
36                this.http.post('https://mybackend.com/api/upload/sanitize-and-save-logo', formData, { headers: headers, responseType: 'blob' })
37                .subscribe(data => {
38                  // Sanitized logo returned from backend
39                })
40                **/
41              } else {
42                this.toastr.error("Maximum 6 files are allowed.");
43              }
44            } else {
45              this.toastr.error("Max size of a file allowed is 1mb, files with size more than 1mb are discarded.");
46            }
47          });
48
49
50        } else {
51          // It was a directory (empty directories are added, otherwise only files)
52          this.toastr.error("Only files in '.pdf', '.jpg', '.jpeg', '.png' format are accepted and directories are not allowed.");
53          // const fileEntry = droppedFile.fileEntry as FileSystemDirectoryEntry;
54          // console.log(droppedFile.relativePath, fileEntry);
55        }
56      }
57    }
58  }
59
60  isFileAllowed(fileName: string) {
61    let isFileAllowed = false;
62    const allowedFiles = ['.pdf', '.jpg', '.jpeg', '.png'];
63    const regex = /(?:\.([^.]+))?$/;
64    const extension = regex.exec(fileName);
65    if (undefined !== extension && null !== extension) {
66      for (const ext of allowedFiles) {
67        if (ext === extension[0]) {
68          isFileAllowed = true;
69        }
70      }
71    }
72    return isFileAllowed;
73  }
74
75  isFileSizeAllowed(size) {
76    let isFileSizeAllowed = false;
77    if (size < 1000000) {
78      isFileSizeAllowed = true;
79    }
80    return isFileSizeAllowed;
81
82  }