angular2 用户关闭页面或返回上一页面时出现提示

Question

我想在用户进入一个router页面后 这时用户如何关闭网页或返回上一router页面时 出现一个提示框 用户点击确认时再关闭或返回 请问大佬们可以有这种操作吗

Answer 1

import { CanDeactivate } from '@angular/router';
import { ProductComponent } from '../product/product.compnent';

export class UnsavedGuard implements CanDeavtivate<ProductComponent>{
    canDeavtivate(componnet: ProductComponent){
        return window.confirm("确定要离开吗");
    }
}

// route.module.ts
import { UnsavedGuard } from './xx/unsaved.guard';

const routes: Routes = [
    
    { path: 'product', component: ProductComponent, canDeactivate:[UnsavedGuard] }
]
@NgModule({
    provider: [UnsavedGuard]
}) 

大概就是这样，可以在官网看看也有案例
https://angular.cn/guide/rout...

Answer 2

可以的，订阅路由变化，再操作

Answer 3

CanDeactivate