Updated to AngularFire2 v5.0.

One important change is that you need to call .snapshotChanges() or .valueChanges() to get data as Observable back.

    return this.db.list<Skill>(`skills/${this.uid}`)
.snapshotChanges()

The problem is when there is no data, .snapshotChanges() never emit a value.

Luckly it is Observable, we can solve the problem by using .startWith():

  getSkills(): Observable<Skill[]> {
return this.db.list<Skill>(`skills/${this.uid}`)
.snapshotChanges()
.startWith([])
.map((actions) =>
actions.map((action) => ({$key: action.key, ...action.payload.val()}))
);
}

If there is no data coming back from firebase, we still emit a empty array. This is much friendly if you work with Ngrx. Because if you depends on .snapshotChange() to emit a value back to switch map to next action, it might just block there, and your next action will never get dispatched.

[AngularFire] Resolve snapshotChanges doesn't emit value when data is empty的更多相关文章

  1. [AngularFire] Firebase OAuth Login With Custom Firestore User Data

    import { NgModule } from '@angular/core'; import { AuthService } from './auth.service'; import { Ang ...

  2. Angular $scope和$rootScope事件机制之$emit、$broadcast和$on

    Angular按照发布/订阅模式设计了其事件系统,使用时需要“发布”事件,并在适当的位置“订阅”或“退订”事件,就像邮箱里面大量的订阅邮件一样,当我们不需要时就可以将其退订了.具体到开发中,对应着$s ...

  3. Emit学习(4) - Dapper解析之数据对象映射(一)

    感觉好久没有写博客了, 这几天有点小忙, 接下来会更忙, 索性就先写一篇吧. 后面估计会有更长的一段时间不会更新博客了. 废话不多说, 先上菜. 一.示例 1. 先建类, 类的名称与读取的表名并没有什 ...

  4. es6中promise ALL Race Resolve Reject finish的实现

    function mypromise(func){ this.statue = "pending"; this.data = null; this.resolveCallback ...

  5. AngularJS路由系列(5)-- UI-Router的路由约束、Resolve属性、路由附加数据、路由进入退出事件

    本系列探寻AngularJS的路由机制,在WebStorm下开发.主要包括: ● UI-Router约束路由参数● UI-Router的Resolve属性● UI-Router给路由附加数据● UI- ...

  6. angular之$broadcast、$emit、$on传值

    文件层级 index.html <!DOCTYPE html> <html ng-app="nickApp"> <head> <meta ...

  7. seajs源码分析

    seajs主要做了2件事 1.定义什么是模块,如何声明模块:id.deps.factory.exports ----define=function(id,deps,factory){return ex ...

  8. 自己修改的两个js文件

    sea-base.js /** * Sea.js 2.2.3 | seajs.org/LICENSE.md */ (function(global, undefined) { // Avoid con ...

  9. Dapper的完整扩展(转)

    真心想说:其实...我不想用Dapper,如果OrmLite.Net支持参数化的话,也就没Dapper的什么事情了,对于OrmLite.Net只能做后续跟踪...... 这个其实是看了Dapper作者 ...

随机推荐

  1. 洛谷——P3374 【模板】树状数组 1

    https://www.luogu.org/problem/show?pid=3374 题目描述 如题,已知一个数列,你需要进行下面两种操作: 1.将某一个数加上x 2.求出某区间每一个数的和 输入输 ...

  2. CentOS 中使用yum出现的“UnicodeDecodeError: &#39;ascii&#39; codec”问题解决方法

    问题 新装了CentOS 6.5系统,打算使用yum安装程序是出现了例如以下错误: Loading mirror speeds from cached hostfile Traceback (most ...

  3. HIT 2255 Not Fibonacci(矩阵高速幂)

    #include <iostream> #include <cstdio> #include <cstring> using namespace std; cons ...

  4. 概率编程语言(Probabilistic Programming Languages)库 —— edward

    注意:tensorflow api 在 1.1.0 以后迎来重大变化,edward 的稳定版依赖于 tensorflow 1.1.0. edward是一个支持概率建模.推断的 Python 第三方库, ...

  5. Github-flavored Markdown 导出为 PDF

    前提条件: 你可以访问Google和它相关的服务 第一步 到Chrome Store安装插件 Markdown Preview Plus 安装以后记得勾选 "允许访问文件网址" 设 ...

  6. OpenGL编程逐步深入(四)Shaders

    OpenGl 中的 Shader在一些中文书籍或资料中都被翻译为"着色器", 单从字面意思也看不出Shader到底是什么,Shader实际上就是一段代码,用于完成特定功能的一个模块 ...

  7. TwinCAT 3中基于UDP协议通讯的C++实现

    因为项目需要,学习了TwinCAT3中使用UDP协议进行通讯的基本知识.这个做个简单的笔记,方便以后查询. 1 概述 倍福为了实现从实时环境中直接访问网卡(network cards)专门提供了一个函 ...

  8. Ubuntu16.04添加HP Laserjet Pro M128fn打印机和驱动

    一.全部设置->打印机->添加新打印机  添加打印机 二.选择自动搜索到的网络打印机HP Laserjet Pro M128fn,点击添加. 三.添加打印机完成,打印测试页进行测试. 四. ...

  9. 学习参考《Python数据分析与挖掘实战(张良均等)》中文PDF+源代码

    学习Python的主要语法后,想利用python进行数据分析,感觉<Python数据分析与挖掘实战>可以用来学习参考,理论联系实际,能够操作数据进行验证,基础理论的内容对于新手而言还是挺有 ...

  10. Codeforces 240E. Road Repairs 最小树形图+输出路径

    最小树形图裸题,只是须要记录路径 E. Road Repairs time limit per test 2 seconds memory limit per test 256 megabytes i ...