angular - ngOnDestroy 在退出前警告用户

Question

我试图找到一种在退出屏幕之前提醒用户的方法。如果他们按“否”，那么它不应该破坏。如果他们按“确定”，则继续进行销毁操作。

ngOnDestory 是否有在 ngOnDestory 之前发生的事件？例如 ngOnBeforeDestroying？

我目前正在使用 Angular 4 进行开发。

Answer 1

是的，你应该使用canDeactivate路由守卫。

创建可注入服务

@Injectable()
class CanDeactivateService implements CanDeactivate<TeamComponent> {


  canDeactivate(
    component: TeamComponent,
    currentRoute: ActivatedRouteSnapshot,
    currentState: RouterStateSnapshot,
    nextState: RouterStateSnapshot
  ): Observable<boolean>|Promise<boolean>|boolean {
    return component.isDirty ;
 }
}

这可以用来确定页面是否可以被销毁。

这应该在路由中配置为

RouterModule.forRoot([
      {
        path: '..', // path
        component: Comp, // name of the component
        canDeactivate: [CanDeactivateService]
      }
    ])
  ],

在这里阅读更多...

Angular 的官方演示

这也可以通过动态组件加载来实现。按照这里的步骤