2 differernt components on the same screen - angular

I'm having 2 different componnents in the same screen, both of the components are containing input fields.

Before I leave the parent component (which holds both of the components) I need to check if the child components have been saved.

So I'm looking for something like that:

export class firstChildComponent{
    constructor(secondChildComponent:SecondChildComponent){}

    ngOnDestroy() {

        if( !this.isAllChangesSaved() || !secondChildComponent.isAllChangesSaved() ){
               showShouldSaveDialog();
        }
    }
}

I don't want to do this check for every component, because then I'll have two different dialogs for the same screen (very annoing).