does not work emit ()

There are three components

The first main, the second is embedded in the first, the third is embedded in the second. The child component communicates with the parent using eventEmitter.

When emit () in the third component in the second function is triggered and if the function has emit () events for the first component, then it no longer works. What is the best way to do in this situation?

Component 3: html:

<mat-radio-group class="radio-group" (change)="statusChange.emit({e: $event, f: loadedPage, c: contract.blankref.name})"> <ng-container *ngFor="let status of fileStatus"> <mat-radio-button *ngIf="secondaryFilesStatus.includes(status.code)" [ngClass]="['radio-button', filestatusColor[status.code].radio]" [checked]="compareStatuses(status, loadedPage.status)" [matTooltip]="status.description" [value]="status"> {{ status.title }} </mat-radio-button> </ng-container> </mat-radio-group> 

ts:

 @Output() statusChange: EventEmitter<any> = new EventEmitter(); 

Component 2:

html:

 <files-work> [files]="files" (statusChange)="statusChangeEmit($event)"> </files-work> 

ts:

 @Output() saveDoc: EventEmitter<any> = new EventEmitter(); statusChangeEmit(data) { this.openChangeDialog(data.e, data.f, data.c); } openChangeDialog(e, file, category) { const oldStatus = file.status ? SharedService.copyObject(file.status) : false; file.status = SharedService.copyObject(e.value); const dialogRef = this.dialog.open(DialogComponent, { width: '500px', height: 'auto', disableClose: true, data: { comment: true, title: 'Вы уверены?', } }); dialogRef.afterClosed().subscribe(result => { if (result && result.confirm) { file.status.comment = result.message; this.saveDoc.emit(); } else { oldStatus ? file.status = oldStatus : delete file.status; } }); } 

Component 1:

html:

 (saveDoc)="onSaveCard()" 

ts:

 onSaveCard() { try { console.log('save') // код не срабатывает при emit() в компоненте 3 this.dataTable.saveCard(false, false); } catch (error) { console.error(error); } }