I work on Angular 7 I face issue event.total give me error as below :
(property) HttpProgressEvent.total?: number | undefined
Total number of bytes to upload or download. Depending on the request or response, this may not be
computable and thus may not be present.
Object is possibly 'undefined'.ts(2532)
I done This Component for upload files .
so How to solve this issue
- import { Component, OnInit, EventEmitter, Output } from '@angular/core';
- import { HttpClient, HttpEventType,HttpProgressEvent } from '@angular/common/http';
-
- @Component({
- selector: 'app-delivery-files',
- templateUrl: './delivery-files.component.html',
- styleUrls: ['./delivery-files.component.css']
- })
-
- export class DeliveryFilesComponent implements OnInit {
-
-
- @Output() public onUploadFinished = new EventEmitter();
-
- constructor(private http: HttpClient,public progress: number,public message: string) { }
- ngOnInit() {
- }
-
- public uploadFile = (files:any) => {
- if (files.length === 0) {
- return;
- }
-
- let fileToUpload = <File>files[0];
- const formData = new FormData();
- formData.append('file', fileToUpload, fileToUpload.name);
-
- this.http.post('https://localhost:5001/api/upload', formData, {reportProgress: true, observe: 'events'})
- .subscribe(event => {
- if (event.type === HttpEventType.UploadProgress)
- this.progress = Math.round(100 * event.loaded / event.total);
- else if (event.type === HttpEventType.Response) {
- this.message = 'Upload success.';
- this.onUploadFinished.emit(event.body);
- }
- });