Issue
I have an Angular 7 application in which I create profiles for users. I need to add a pdf file (optional) along with the other credentials of the user.
am using angular 7 ,.net framework and mongoDB for this project
this is what I done so far:
HTML:
<label class="secondary-text" style="float: left;"> Add Attachment </label>
<input type="file" hidden #fileUpload (change)="getFileUrl($event)" />
<mat-icon class="secondary-text pointer" (click)="fileUpload.click()" style="float: left;"> attach_file </mat-icon>
JS:
getFileUrl(event) {
var file = event.target.files[0];
var myReader: FileReader = new FileReader();
myReader.onloadend = (e) => {
let res = myReader.result;
let formData = new FormData();
formData.append("formFile", file);
}
myReader.readAsArrayBuffer(file);
}
Solution
There are two ways to manage this situation.
Option 1:
Either you can upload a file in any project folder on server side using file read and write feature.
Then you need to rename the file and append the timestamp and just add that file name entry in db. When you need the file you can read/get the file from folder.
Option 2:
Just upload the file on cloud like Amazon S3 and store the file name in db. And when you need it just pass the URL/link so you will get the file.
var reader = new FileReader();
reader.onload = function (e) {
//get all content
console.log('Sending file...');
var buffer = e.target.result;
bufferdata = buffer;
console.log('file send');
};
reader.readAsArrayBuffer(file);