码迷,mamicode.com
首页 > 其他好文 > 详细

angular 禁止回退

时间:2020-06-02 18:43:04      阅读:81      评论:0      收藏:0      [点我收藏+]

标签:confirm   import   组件   log   文章   code   一个   mic   用户   

1.创建路由CanDeactivate文件

import { CanDeactivate } from "@angular/router";
// import { UserLockComponent } from "../lock/lock.component";
import {UserLockComponent} from ‘./lock.component‘;

export class BackGuard implements CanDeactivate<UserLockComponent>{
  //第一个参数 范型类型的组件
  //根据当前要保护组件 的状态 判断当前用户是否能够离开
  canDeactivate(component: UserLockComponent){
 if(component.backType == ‘history‘){
   return false;
 }else if(component.backType == ‘submit‘){
   return true;
 }else{
   return false;
 }
    // return window.confirm(‘你还没有保存,确定要离开吗?‘);
  }
}

2.路由中使用

技术图片

 

 

3.当前页面的ts文件

技术图片

 

 4.其中的backtype 是用来判断当前的操作事件。我这应该不是好的办法,有好的方法,可以留言告诉我

借鉴文章 https://blog.csdn.net/Beiwei_Huang/article/details/105089187

 

angular 禁止回退

标签:confirm   import   组件   log   文章   code   一个   mic   用户   

原文地址:https://www.cnblogs.com/zhawei/p/13032820.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!