2

我正在开发一个角度应用程序，如果用户在编辑时离开页面时未保存更改，我需要显示一条警报消息。

我已经为此在路由中创建并注册了一个 candeactivate 防护，它在父组件中运行良好。但不能在子组件中工作。如何解决这个问题？

{
    path: 'create',
    component: CreateComponent,
    canDeactivate: [ConfirmationGuard],
},
{
    path: ':id',
    component: ViewUserComponent,
    children: [
        {
            path: ':id',
            component: AddressComponent,
            canDeactivate: [ConfirmationGuard],
        },
    ],
    canDeactivate: [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>;
 }
4

2 回答 2

1

ConfirmationGuard 需要是一个实际的服务......换句话说，它必须是@Injectable，并在模块中提供（或者您可以使用providedIn：root）。

于 2019-05-21T14:28:40.330 回答
0

如果 AddressComponent 有一个模块，你可以在 import 部分下的 @NgModule 中导入它自己的模块，以确保你将导入它的所有导入、声明或提供程序

于 2019-09-17T10:21:56.070 回答