假设路由守卫有这种场景

需要使用observable同时发送多个Http 请求,判断request2返回的数据中是否存在request1返回的数据

使用async await

export class testAuth implements CanActivate {
username = localStorage.getItem("username");
EmployeeNo: any;
constructor(
private dpaService: DpaService,
private testService: TestService,
) { }
async canActivate(
next: ActivatedRouteSnapshot,
state: RouterStateSnapshot): Promise<boolean | UrlTree> {
try{
if(this.username){
//forkJoin同时发送多个http请求
return await forkJoin([this.dpaService.getUserByEmail(this.username),this.testService.queryAll()])
.toPromise().then((results:any)=>{
//results为多个请求返回的结果数组
this.EmployeeNo = results[0][0].EmployeeNo;
return results[1].filter((element: any)=>element.emplId === this.EmployeeNo).length>0;
});
}
else{
return false;
}
} catch(err){
return false;
}
}
}

angular 路由守卫Observable异步请求串联的更多相关文章

  1. Angular路由守卫 canDeactivate

    目的 离开页面时,做出逻辑判断 以ng-alain的项目为基础做演示 效果如图: 关键代码 定义一个CanDeactivateGuardService export class CanDeactiva ...

  2. Angular 路由守卫

    1. 路由 Angular路由: 可以控制页面跳转:可以在多视图间切换: 2. 路由守卫 Angular路由守卫: 在进入或离开某路由时,用于判断是否可以离开.进入某路由::: return true ...

  3. Angular路由守卫 canActivate

    作用 canActivate 控制是否允许进入路由. canActivateChild 等同 canActivate,只不过针对是所有子路由. 关键代码 创建路由守卫 import { Injecta ...

  4. angular路由守卫

     路由守卫是指当用户满足了某些要求之后才可以离开或者进入某个页面或者场景的时候使用.比如说只有当用户填写了用户名和密码之后才可以进入首页,比如说用户离开某个页面时明月保存信息提示用户是否保存信息后再离 ...

  5. 微信小程序 路由跳转 异步请求 存储数据,微信登录接口

    1小程序路由跳转 wx.switchTab(Object object) 这里的tabBar是底下的导航栏指定的页面 跳转到 tabBar 页面,并关闭其他所有非 tabBar 页面 tabBar l ...

  6. angular4.0 路由守卫详解

    在企业应用中权限.复杂页多路由数据处理.进入与离开路由数据处理这些是非常常见的需求. 当希望用户离开一个正常编辑页时,要中断并提醒用户是否真的要离开时,如果在Angular中应该怎么做呢? 其实Ang ...

  7. Angular 从入坑到挖坑 - 路由守卫连连看

    一.Overview Angular 入坑记录的笔记第六篇,介绍 Angular 路由模块中关于路由守卫的相关知识点,了解常用到的路由守卫接口,知道如何通过实现路由守卫接口来实现特定的功能需求,以及实 ...

  8. Angular路由——路由守卫

    一.路由守卫 当用户满足一定条件才被允许进入或者离开一个路由. 路由守卫场景: 只有当用户登录并拥有某些权限的时候才能进入某些路由. 一个由多个表单组成的向导,例如注册流程,用户只有在当前路由的组件中 ...

  9. angular路由详解六(路由守卫)

    路由守卫 CanActivate: 处理导航到某个路由的情况. CanDeactivate:处理从当前路由离开的情况. Resole:在路由激活之前获取路由数据. 1.CanActivate: 处理导 ...

  10. angular 2+ 路由守卫

    1. 定义接口名称 /domain/login-guard.ts export interface LoginGuard { data: any; msg: string; status: boole ...

随机推荐

  1. linux命令与公私钥

    昨日内容回顾 etc目录 配置相关 /etc/profile 环境变量文件 /etc/motd 开机欢迎界面 usr目录 程序相关 四种安装软件的方式 1.yum安装 自动解决依赖性问题 2.rap安 ...

  2. mov eax,dword ptr[0x00aff834] 和 lea eax,[0x00aff834]区别

    mov eax,dword ptr[0x00aff834] 和 lea eax,[0x00aff834]区别 mov eax,[内存]是将内存的值赋值给eax,而lea是直接将地址值赋值给eax 因此 ...

  3. ubuntu20.04 gnome桌面系统添加开机自启动GUI程序

    在终端执行 gnome-session-properties,点击添加自己的脚本或执行文件,便可以在用户登录后自动执行.

  4. Vue.js 前端项目在常见 Web 服务器上的部署配置

    Web 服务器是一种用于存储,处理和传输Web内容的软件.它是一种特殊类型的服务器,具有处理 HTTP 请求并向浏览器返回 Web 页面和其他内容的能力.Web服务器支持多种编程语言,如 PHP,Ja ...

  5. 用GC的策略,管理团队的技术债务

    在数字化时代,每一个组织的经营都是建立在数字化的系统之上的,而数字化系统的构建,必然就会带来技术债务,这是每一个数字化团队都要面临的一个问题,如何有效的管控技术债务. 技术债务的产生,是技术团队不断迭 ...

  6. flex实现圣杯布局

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. MongoDB数据库记录

    启动 MongoDB 服务 标准 URI 连接语法: mongodb://[username:password@]host1[:port1][,host2[:port2],...[,hostN[:po ...

  8. 逻辑运算符、成员运算符、身份运算符、流程控制、if判断、while循环

    目录 一.逻辑运算符 二.成员运算符 三.身份运算符 四.流程控制 五.分支结构 (1).单if判断 (2).双分支结构 (3).多分支结构 (4).if的嵌套使用 六.循环结构while (1).w ...

  9. C++ 练习11 string的使用

    1 #include <iostream> 2 #include<string>//调用string函数库 3 using namespace std; 4 int main( ...

  10. NETAPP FAS2720初始化配置

    配置前准备 1.管理地址(必须)3个:1个集群管理地址,2个节点管理地址2.SP地址2个:2个底层管理地址,相当于服务器BMC地址,配置完成后可以远程进行系统重装等操作3.DNS地址:使用CIFS需要 ...