Unable to upload all types of files to server - development

Unable to upload all types of files to server

Hi My issue is on Fle uploading..

My Application front end is Angular 4 and Back End is Laravel…

I have added no third party library to upload files.

And the issue is I am able to upload only .txt files with the below code,
but it is not working for pdf, image, xls, docx……(need to upload all types of files)

i am using the following code to upload files .

HTML CODE::

 <div class="form-group">
  <label for="files">File Selection::</label>
  <input type="file" id="avatar" (change)="onFileChange($event)" #fileInput multiple><br>
  <button type="button" class="btn btn-sm btn-default" (click)="clearFile()">clear file</button>
  <br>
    </div>

COMPONENT.TS CODE::

onFileChange(event) {
    debugger;
    console.log('filesevent###########', event);
    let reader = new FileReader();
    if (event.target.files && event.target.files.length > 0) {
      let file = event.target.files[0];
      // reader.readAsDataURL(file);
       reader.readAsText(file);                    //reader.result)

      reader.onload = () => {
        this.form.get('fileData').setValue({
          filename: file.name,
          filetype: file.type,
          value: reader.result,       //.split(',')[1]
        });
        console.log(typeof(reader.result));
        console.log('fileData#####', this.form.get('fileData').value);
        this.locService.sendFileData(this.form.get('fileData').value)
       .subscribe(success => console.log('msg@@@@@@@@', success));
      };
    }
  }

SERVICE.TS CODE::

  sendFileData(data): Observable<any> { 
      return this.http.post(this.config.STORE_KEY + '/public/api/generic/image/add/' +
      this.userDetails.roleid, data).map((res: Response) => {
       res.json();
      }).catch(this.handleError);
    }

from Laravel Questions and Answers https://laravelquestions.com/laravel/unable-to-upload-all-types-of-files-to-server/
via Lzo Media