动态注册canDeactivate防护并提示确认导航

Question

组件是否可以通过任何方式为其自身动态注册canDeactivate保护？ 主要是为了提示/停止用户导航，并显示是/否之类的确认信息。

我之所以要这样做，是因为所涉及的应用程序很大，并且工作流组件（例如付款，转账等）分散在应用程序的许多不同模块中。我不确定在路由器配置中静态注册它们是否是个好主意。

我正在寻找一种在组件中可以提示和控制类似于警卫的导航的方法。

Answer 1

组件无法注册路由器防护，但是最常见的canDeactivate实现依赖于要定义的组件方法。

简化版本可以是：

export interface CanComponentDeactivate {
  canDeactivate: () => Observable<boolean> | Promise<boolean> | boolean;
}

@Injectable()
export class CanDeactivateGuard implements CanDeactivate<CanComponentDeactivate> {
 canDeactivate(component: CanComponentDeactivate) {
   return component.canDeactivate ? component.canDeactivate() : true;
 }
} 

基本上，如果某个组件公开了一种canDeactivate方法，则它将用于控制停用，否则路由器导航将继续。

我会在您的顶级组件上注册类似的保护措施，并让单个组件实现或不实现特定方法。