остановить загрузку файла при изменении вкладки в angular 9

Question

У меня есть форма для редактирования.

в этой форме у меня есть буксировочная вкладка => tab A для редактирования и tab B для загрузки файла.

это мой код в форме:

<div class="form-container">

<mat-tab-group dynamicHeight (selectedTabChange)="activateTab($event.index)" class="col-xs-12 col-sm-12 col-md-12 col-sm-offset-1 col-md-offset-2 p-0">
    <mat-tab [label]="'NEWS.EDIT' | translate">
        <div class="form-content">
            <form class="form" id="postform" [formGroup]="newsEditForm" (ngSubmit)="onSubmit()" autocomplete="off">

                <mat-form-field class="mat-form-field-fluid" appearance="outline">
                    <mat-label>{{'GENERAL.TITLE' | translate}} *</mat-label>
                    <input matInput formControlName="title" [placeholder]="'GENERAL.TITLE' | translate">
                    <mat-error *ngIf="newsEditForm.get('title').errors?.required">
                        {{ 'MAGAZINE_SHARE.VALIDATION.REQUIRED.TITLE' | translate }}</mat-error>
                    <mat-error *ngIf="newsEditForm.get('title').errors?.maxlength">
                        {{ 'MAGAZINE_SHARE.VALIDATION.MAX_LENGTH.TITLE' | translate }}</mat-error>
                </mat-form-field>
    </form>
    </mat-tab>
    <mat-tab [label]="'MAGAZINE_SHARE.FIELS' | translate">

        <kt-list-file-news [postId]="postId" [apiControllerName]="apiControllerName" [postFileList]="editNewsModelOld.files" [urlShowFile]="urlShow" [coverUrlShowFile]="coverUrlShowFile" [service]="newsService" [IdName]="'postId'" [fileService]="fileService">
        </kt-list-file-news>

    </mat-tab>
</mat-tab-group>
<!-- end form -->

это компонент для загрузки файла в tab B:

    <kt-list-file-news [postId]="postId" [apiControllerName]="apiControllerName" [postFileList]="editNewsModelOld.files" [urlShowFile]="urlShow" [coverUrlShowFile]="coverUrlShowFile" [service]="newsService" [IdName]="'postId'" [fileService]="fileService">
    </kt-list-file-news>

теперь у меня есть проблема. когда я загружаю файл в форму загрузки, я за исключением перехода на загрузку, например, в 32% я изменяю вкладку, и мне нужен файл, загруженный в фоновом режиме, но когда я вернулся на вкладку загрузки, я увидел, что загрузка файла остановлен в чем проблема ? как я могу решить эту проблему ???

    this.subscriptions.push(this.service
        .UplaodFile(uploadModel, this.apiControllerName)
        .subscribe(
            (event: HttpEvent<any>) => {
                switch (event.type) {
                    case HttpEventType.UploadProgress:
                        if (event.total) {
                            this.queueProgress = Math.round(event.loaded / event.total * 100);
                            btnProgress[0].innerText = this.queueProgress + ' % ';
                            progressLine[0].width = this.queueProgress;
                            progressLine[0].setAttribute('style', 'width:' + 0 + '%');
                            progressLine[0].setAttribute('style', 'width:' + this.queueProgress + '%');
                            this.cdRef.detectChanges();
                        }
                        break;
                    case HttpEventType.Response:
                        if (event.body['success']) {
                            this.queueProgress = null;
                            this.alertService.success('', 'GENERAL.ADD_SUCCESS');
                            this.removeItem(index, false);
                            this.uploadBtndisabel = true;
                            this.fileUpload.type = this.fileType.Text;
                            this.previewActive = true;
                            this.queueProgress = 0;
                            this.uploadPalceHolder = undefined;
                            this.uploadActive = true;
                            this.postFileList.push(event.body['result']);
                            this.cdRef.detectChanges();
                        }
                        this.loading = false;
                        this.queueProgress = null;
                        break;
                }
            },
            () => {
                this.loading = false;
                this.queueProgress = null;
            }
        ));