[AngularFire2] Building an Authentication Observable Data Service
After successfully login, we want something help to check whether user has already login or not. And we will use Observable to do that.
Create AuthInfo.ts:
export class AuthInfo {
constructor(private uid$: string){ } isLoggedIn() {
return !!this.uid$;
}
}
The class is very simple, accpets an uid which return from FirebaseAuth, and a method to check whether id is set already.
TO user Observable to handle the data:
AuthService.ts:
static UNKNOW_USER = new AuthInfo(null); // Create a default unknow user
public authInfo$: BehaviorSubject<AuthInfo> = new BehaviorSubject<AuthInfo>(AuthService.UNKNOW_USER); // We user BehaviorSubject to to conver to Observable, Behavior Subject already needs a default value, so we can repersent logout status by using default value
login(email, password) { return this.fromFirebaseAuthPromise(this.auth$.login({
email, password
},{
method: AuthMethods.Password,
provider: AuthProviders.Password
}));
} fromFirebaseAuthPromise(promise) {
const subject = new Subject<any>(); promise.then((res) => {
const uid = this.auth$.getAuth().uid;
const authInfo = new AuthInfo(uid);
this.authInfo$.next(authInfo);
subject.next(res);
subject.complete();
}, err => {
this.authInfo$.error(err);
subject.error(err);
subject.complete();
}); return subject.asObservable();
}
Everytime,we successfully login, will emit a uid.
So to show / hide show content based on 'authInfo$', we can do:
<md-list-item>
<a
*ngIf="authInfo$.isLoggedIn()"
[routerLink]="['/heros', {outlets: {'wiki': null}}]"
routerLinkActive="active"
[routerLinkActiveOptions]="{exact: true}"
>Heros</a>
</md-list-item>
authInfo$;
constructor(private auth: AuthService){
this.auth.authInfo$.subscribe(
res => {
this.authInfo$ = res;
}
)
}
[AngularFire2] Building an Authentication Observable Data Service的更多相关文章
- WCF Data Service
WCF Data Service:http://www.cnblogs.com/shanyou/category/240225.html
- 我的WCF Data Service 系列 (一、为什么要有WCF Data Service)
开篇先说两名题外话, 在博问上,经常看到有个问性能问题,比如Entity Framework的性能行不行啊之类的. 其实这个行不行,关键还是看对象,一夜家族的老七可能勉强吃点蓝片片,也就行了,可真要让 ...
- WCF Data Service 使用小结(二) —— 使用WCF Data Service 创建OData服务
在 上一章 中,介绍了如何通过 OData 协议来访问 OData 服务提供的资源.下面来介绍如何创建一个 OData 服务.在这篇文章中,主要说明在.NET的环境下,如何使用 WCF Data Se ...
- WCF Data Service 使用小结 (一)—— 了解OData协议
最近做了一个小项目,其中用到了 WCF Data Service,之前是叫 ADO.NET Data Service 的.关于WCF Data Service,博客园里的介绍并不多,但它确实是个很好的 ...
- WCF Data Service 使用小结 —— 了解OData(一)
最近做了一个小项目,其中用到了 WCF Data Service,之前是叫 ADO.NET Data Service 的.关于WCF Data Service,博客园里的介绍并不多,但它确实是个很好的 ...
- 调用WCF Data Service的几点Tips
使用Linq实现sql in statement的时候,用EF的时候可以通过Contains.Exists的方法实现.但是在使用WCF Data Service的context的时候,会报不支持该方法 ...
- Custom Data Service Providers
Custom Data Service Providers Introduction Data Services sits above a Data Service Provider, which i ...
- 自定义Data Service Providers
自定义Data Service Providers 作者:AlexJ 翻译:谈少民 原文链接:http://blogs.msdn.com/b/alexj/archive/2010/01/07/data ...
- 使用WCF Data Service 创建OData服务
使用WCF Data Service 创建OData服务 在 上一章 中,介绍了如何通过 OData 协议来访问 OData 服务提供的资源.下面来介绍如何创建一个 OData 服务.在这篇文章中,主 ...
随机推荐
- badblocks 检查硬盘是否有坏道
硬盘是比較easy坏掉的设备,使用一段时间后可能会出现坏道等物理故障. 当硬盘出现坏道后,若不及时更换或者进行技术上的处理,磁盘的坏道就会越来越多,并会造成频繁死机和数据丢失. 最好的处理方法是更换新 ...
- POJ 3243 Clever Y Extended-Baby-Step-Giant-Step
题目大意:给定A,B,C,求最小的非负整数x,使A^x==B(%C) 传说中的EXBSGS算法0.0 卡了一天没看懂 最后硬扒各大神犇的代码才略微弄懂点0.0 參考资料: http://quarter ...
- [NowCoder]牛客网NOIP赛前集训营-提高组(第六场)题解
A.最长路 题意:给定有向图,每条边有个字符\([0,10^9]\),求每个点最长路字典序最小的方案.\(N,M\le 10^6\) 建反图跑拓扑排序,显然入过队的点都有最长路,考虑如何判断字典序大小 ...
- Dcloud课程8 开心一刻应用如何实现
Dcloud课程8 开心一刻应用如何实现 一.总结 一句话总结:app就是远程调用接口获得数据,我们在后台要做的,就是写一个个让页面获得接口的数据.这里用的是公共笑话接口. 1.ajax返回给页面的h ...
- 从“窃听门”事件解读手机Rootkit攻击
从"窃听门"事件解读手机Rootkit攻击 在今年五月讲述了手机流氓软件危害与防治(http://chenguang.blog.51cto.com/350944/557191)文章 ...
- ASP.NET MVC 4 (十一) Bundles和显示模式--asp.net mvc中 @Scripts.Render("~/bundles/jquery")是什么意思? 在布局文件中使用Scripts.Render()输出脚本包,Styles.Render()输出风格包:
ASP.NET MVC 4 (十一) Bundles和显示模式 ASP.NET MVC 4 引入的js打包压缩功能.打包压缩jquery目录下的文件,在布局文件中使用Scripts.Render()输 ...
- Vue路由query传参
1.不要进行过深的嵌套 let id = 'uyu' this.$router.push({ path: '/mrp_detail', query: { re_order_id: id, option ...
- PatentTips - Method to manage memory in a platform with virtual machines
BACKGROUND INFORMATION Various mechanisms exist for managing memory in a virtual machine environment ...
- 移动mm 话费支付接入过程(ane)
下面记录移动mm 话费支付接入的过程 1.强联网.弱联网差别.sdk是否有区分?用户体验部分由什么不同和差异? 差别在于强联网是网络通道(wifi/gprs/3g),弱联网是走短信通道,用户层面差异在 ...
- JAVA 水题
纯粹是让我来掌握熟练度的. 1.金蝉素数 某古寺的一块石碑上依稀刻有一些神秘的自然数. 专家研究发现:这些数是由1,3,5,7,9 这5 个奇数字排列组成的5 位素数,且同时去掉它的最高位与最低位数字 ...