Включить candeactivate для дочернего компонента

Question

Я работаю над угловым приложением, мне нужно показать предупреждение, если пользователь покидает страницу с несохраненными изменениями во время редактирования.

Я создал и зарегистрировал для этого защиту от перебоя в маршрутах, которая отлично работает в родительском компоненте. Но не работает в дочернем компоненте. Как решить эту проблему?

{
    path: 'create',
    component: CreateComponent,
    canDeactivate: [ConfirmationGuard],
},
{
    path: ':id',
    component: ViewUserComponent,
    children: [
        {
            path: ':id',
            component: AddressComponent,
            canDeactivate: [ConfirmationGuard],
        },
    ],
    canDeactivate: [ConfirmationGuard],
},

'create' работает хорошо, но адресный компонент не работает, так как это дочерний компонент!

confirmationguard.ts: -

import { Component } from '@angular/core';
import { CanDeactivate } from '@angular/router';
import { ConfirmLeaving } from './interface';

 export declare class ConfirmationGuard implements 
 CanDeactivate<ConfirmLeaving | Component> {

 canDeactivate(component: ConfirmLeaving | Component): Promise<boolean>;
 }

Answer 1

ConfirmationGuard должен быть реальным сервисом ... другими словами, он должен быть @Injectable и предоставлен в модуле (или вы можете использовать обеспечитьIn: root).