angular 路由守卫Observable异步请求串联
假设路由守卫有这种场景
需要使用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异步请求串联的更多相关文章
- Angular路由守卫 canDeactivate
目的 离开页面时,做出逻辑判断 以ng-alain的项目为基础做演示 效果如图: 关键代码 定义一个CanDeactivateGuardService export class CanDeactiva ...
- Angular 路由守卫
1. 路由 Angular路由: 可以控制页面跳转:可以在多视图间切换: 2. 路由守卫 Angular路由守卫: 在进入或离开某路由时,用于判断是否可以离开.进入某路由::: return true ...
- Angular路由守卫 canActivate
作用 canActivate 控制是否允许进入路由. canActivateChild 等同 canActivate,只不过针对是所有子路由. 关键代码 创建路由守卫 import { Injecta ...
- angular路由守卫
路由守卫是指当用户满足了某些要求之后才可以离开或者进入某个页面或者场景的时候使用.比如说只有当用户填写了用户名和密码之后才可以进入首页,比如说用户离开某个页面时明月保存信息提示用户是否保存信息后再离 ...
- 微信小程序 路由跳转 异步请求 存储数据,微信登录接口
1小程序路由跳转 wx.switchTab(Object object) 这里的tabBar是底下的导航栏指定的页面 跳转到 tabBar 页面,并关闭其他所有非 tabBar 页面 tabBar l ...
- angular4.0 路由守卫详解
在企业应用中权限.复杂页多路由数据处理.进入与离开路由数据处理这些是非常常见的需求. 当希望用户离开一个正常编辑页时,要中断并提醒用户是否真的要离开时,如果在Angular中应该怎么做呢? 其实Ang ...
- Angular 从入坑到挖坑 - 路由守卫连连看
一.Overview Angular 入坑记录的笔记第六篇,介绍 Angular 路由模块中关于路由守卫的相关知识点,了解常用到的路由守卫接口,知道如何通过实现路由守卫接口来实现特定的功能需求,以及实 ...
- Angular路由——路由守卫
一.路由守卫 当用户满足一定条件才被允许进入或者离开一个路由. 路由守卫场景: 只有当用户登录并拥有某些权限的时候才能进入某些路由. 一个由多个表单组成的向导,例如注册流程,用户只有在当前路由的组件中 ...
- angular路由详解六(路由守卫)
路由守卫 CanActivate: 处理导航到某个路由的情况. CanDeactivate:处理从当前路由离开的情况. Resole:在路由激活之前获取路由数据. 1.CanActivate: 处理导 ...
- angular 2+ 路由守卫
1. 定义接口名称 /domain/login-guard.ts export interface LoginGuard { data: any; msg: string; status: boole ...
随机推荐
- 使用linux命令直接在网上下载文件,解压,改名
举例: 我们想要在服务器某个路径下,下载一个node.js包 操作如下 假如文件地址为https://npm.taobao.org/mirrors/node/v16.9.1/node-v16.9.1- ...
- Angular在用户登录后设置授权请求头headers.append('Authorization', 'token');
方案1. 使用Angular http import {Injectable} from '@angular/core'; import {Http, Headers} from '@angular ...
- Kubernetes(k8s)密码管理:Secret
目录 一.系统环境 二.前言 三.Secret概览 四.Secret 的类型 五.各种类型的secret使用实例 5.1 创建kubernetes.io/service-account-token类型 ...
- epoll分布式通讯
参考http://www.xmailserver.org/linux-patches/nio-improve.html epoll通讯 参考https://blog.csdn.net/yangqua ...
- 【学习笔记】XR872 GUI Littlevgl 8.0 移植(显示部分)
LVGL 介绍 官方网站:LVGL - Light and Versatile Embedded Graphics Library 源码位置:GitHub - lvgl/lvgl: Powerful ...
- 【学习笔记】Http请求方法总结
Http常用请求方法对比 请求方法 常见参数传递方式 是否幂等 说明 API举例 GET URL,注意:Http协议对URL长度没有限制,所谓的限制是浏览器和处理服务器的 幂等 用于查询 批量查询:/ ...
- Vue31 消息订阅和发布
1 简介 组件之间的通信除了使用事件总线之外,还可以使用一些插件来通过消息的订阅和发布来实现.pubsub-js就是一个不错的选择. 2 使用 2.1 安装 npm i pubsub-js # 或 y ...
- mysql14 sql优化-索引失效
1.索引失效 先创建符合索引,三个字段 ALTER table abilityassessrecord add INDEX idx_customerno_roomno_abilityassessrec ...
- (二) MdbCluster分布式内存数据库——分布式架构1
(二) MdbCluster分布式内存数据库--分布式架构1 分布式架构是MdbCluster的核心关键,业界有很多相关的实现,却很少有文章详细的解释每个架构实现背后的细节和这么做的原因.在Mdb ...
- Apache Hudi 流转批 场景实践
背景 在某些业务场景下,我们需要一个标志来衡量hudi数据写入的进度,比如:Flink 实时向 Hudi 表写入数据,然后使用这个 Hudi 表来支持批量计算并通过一个 flag 来评估它的分区数据是 ...