error on event.total object possibly is undefined when Upload file?

Question

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);
        }
      });