[AngularFire 2 ] Hello World - How To Write your First Query using AngularFire 2 List Observables ?
In this lesson we are going to use AngularFire 2 for the first time. We are going to configure the AngularFire 2 module, inject the AngularFire service in our service layer and use it do our first Firebase query: we are going to retrieve a list of objects from the database.
Install:
//install npm install --save angularfire2
Import AngularFireModule in app.module.ts:
...
import {firebaseConfig} from "../environments/firebase.config";
import {AngularFireModule} from "angularfire2"; @NgModule({
...
imports: [
...
AngularFireModule.initializeApp(firebaseConfig)
],
Load the data in service: realtime.service.ts:
import { Injectable } from '@angular/core';
import {AngularFire, FirebaseListObservable} from "angularfire2";
@Injectable()
export class RealtimeService {
constructor(private af: AngularFire) {
const courses$: FirebaseListObservable<any> = af.database.list('courses');
courses$.subscribe(
val => console.log("val", JSON.stringify(val, null, ))
)
}
}
firebase database.list() method return 'FirebaseListObservable' type.

[AngularFire 2 ] Hello World - How To Write your First Query using AngularFire 2 List Observables ?的更多相关文章
- [Firebase] 1. AngularFire, $save, $add and $remove, Forge
Basic angularFire options: $save, $add and $remove. The way connect firebase: var app = angular.modu ...
- [Angular] AuthService and AngularFire integration
Config AngularFire, we need database and auth module from firebase. import {NgModule} from '@angular ...
- [AngularFire 2] Object Observables - How to Read Objects from a Firebase Database?
In this lesson we are going to learn how to use AngularFire 2 to query objects, and read them from t ...
- [AngularFire 2] Joins in Firebase
Lets see how to query Firebase. First thing, when we do query, 'index' will always help, for both SQ ...
- [AngularFire] Firebase OAuth Login With Custom Firestore User Data
import { NgModule } from '@angular/core'; import { AuthService } from './auth.service'; import { Ang ...
- [AngularFire] Angular File Uploads to Firebase Storage with Angular control value accessor
The upload class will be used in the service layer. Notice it has a constructor for file attribute, ...
- [AngularFire] Resolve snapshotChanges doesn't emit value when data is empty
Updated to AngularFire2 v5.0. One important change is that you need to call .snapshotChanges() or .v ...
- [Angular] Reactive Store and AngularFire Observables
A simple store implemenet: import { Observable } from 'rxjs/Observable'; import { BehaviorSubject } ...
- [AngularFire 2] Push, remove, update
import { Injectable } from '@angular/core'; import {RealtimeService} from "../shared"; imp ...
随机推荐
- 66.app.use(express.static)
转自:https://blog.csdn.net/u010977147/article/details/60956502
- Ajax缓存原理
一.什么是Ajax缓存原理? Ajax在发送的数据成功后,会把请求的URL和返回的响应结果保存在缓存内,当下一次调用Ajax发送相同的请求时,它会直接从缓存中把数据取出来,这是为了提高页面的响应速度和 ...
- vuejs模板中使用html代码
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- Snapshot Standby
INTRODUCTION Snapshot standby database是ORACLE 11g的新特性.允许Physical standby短时间的使用read write模式. Snapshot ...
- HTML 页面内容禁止选中
写一个小笔记,怎么禁止HTML页面不被选中,复制. CSS: *{ moz-user-select: -moz-none; -moz-user-select: none; -o-user-select ...
- passwd---设置用户密码的相关信息
passwd命令 passwd命令用于设置用户的认证信息,包括用户密码.密码过期时间等.系统管理者则能用它管理系统用户的密码.只有管理者可以指定用户名称,一般用户只能变更自己的密码. 语法 pas ...
- NSCharacterSet 最经常使用的使用方法
NSString *str = @"<p>讨厌的</p>节点<br/></pN>"; //除去字符串中的不想要的 ...
- SDNU 1206.蚂蚁感冒 【代码如此简单,思维练习】【7月29】
蚂蚁感冒 Description 长100厘米的细长直杆子上有n仅仅蚂蚁. 它们的头有的朝左,有的朝右. 每仅仅蚂蚁都仅仅能沿着杆子向前爬,速度是1厘米/秒. 当两仅仅蚂蚁碰面时.它们会同一时候掉头往 ...
- 辛星跟您玩转vim第三节之程序猿特须要的移动方式
前面第二节我首先值得一提的是,我的vim教程pdf版本号已经写完了.大家能够去下载,这里是csdn的下载地址:csdn下载.假设左边的下载地址挂掉了.也能够自行在浏览器以下输入例如以下地址进行下载:h ...
- 混合式框架-AngularJS
简单介绍 AngularJS是为了克服HTML在构建应用上的不足而设计的.HTML是一门非常好的为静态文本展示设计的声明式语言,但要构建WEB应用的话它就显得乏力了.所以我做了一些工作(你也能够认 ...