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. cocos2d-x 显示触摸操作(显示水波点击效果,用于视频演示)

    昨天刚刚參加玩游戏设计大赛, 积累了一些东西. 接下去将会逐个分享出来. 首先是显示触摸操作. 由于要演示我们的作品.使用试玩过程中, 假设没办法显示我们的触摸操作(像录制视频一样, 点击了屏幕某点, ...

  2. 为什么用卷积滤波,而不是非常easy的在频率领域内进行数据的频率处理

    卷积.为了更好的"动态"滤波. 问题来了.为什么用卷积滤波.而不是非常easy的在频率领域内进行数据的频率处理? 为了强调我觉得的答案,已经用blog标题给出了.卷积.为了更好的& ...

  3. 使用ssh过程中对数据库进行update时报错

    报错信息:org.springframework.dao.InvalidDataAccessApiUsageException: Write operations are not allowed in ...

  4. hadoop集群中动态添加新的DataNode节点

    集群中现有的计算能力不足,须要另外加入新的节点时,使用例如以下方法就能动态添加新的节点: 1.在新的节点上安装hadoop程序,一定要控制好版本号,能够从集群上其它机器cp一份改动也行 2.把name ...

  5. Day2代码

    #include<cstdio> #include<cstring> #include<cmath> #include<algorithm> #defi ...

  6. Android 使用Gallery组件实现图片播放预览

    Gallery(画廊)扩展了LayoutParams,以此提供可以容纳当前的转换信息和先前的位置转换信息的场所. Activity package com.app.test01; import com ...

  7. 远程带参数POST访问接口,返回数据

    1. string token = GetRequest.GetString("token"); int customer_id = GetRequest.GetInt(" ...

  8. JSP中 input type 用法

    JSP中 input type 用法 Input表示Form表单中的一种输入对象,其又随Type类型的不同而分文本输入框,密码输入框,单选/复选框,提交/重置按钮等,下面一一介绍. 1,type=te ...

  9. Tensorflow 学习笔记 -----tf.where

    TensorFlow函数:tf.where 在之前版本对应函数tf.select 官方解释: tf.where(input, name=None)` Returns locations of true ...

  10. 如何批量telnet查看否开放指定端口

    由于机房搬迁,需要重新telnet看看网络是否联通 [weblogic@pays03pre_BankVerify /]$ telnet 172.29.1.159 22Trying 172.29.1.1 ...