Skip to content

Commit fefe3e5

Browse files
committed
docs(migration): migration guide to 5.0
1 parent 53c06d2 commit fefe3e5

File tree

3 files changed

+75
-2
lines changed

3 files changed

+75
-2
lines changed

README.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ Status: Release candidate
1919

2020
[Stackblitz Template](https://stackblitz.com/edit/angular-2ed5zx?) - Remember to set your Firebase configuration in `app/app.module.ts`.
2121

22-
[Upgrading to v4.0? Check out our guide.](docs/version-4-upgrade.md)
22+
[Upgrading to v5.0? Check out our guide.](docs/version-5-upgrade.md)
2323

2424
## Install
2525

docs/version-5-upgrade.md

Lines changed: 73 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,73 @@
1+
# Upgrading to AngularFire 5.0
2+
3+
AngularFire 5.0 is a refactor of the `AngularFireDatabase` module. It removes the `FirebaseListObservable` and `FirebaseObjectObservable` in favor of a generic based service API.
4+
5+
## Updating `FirebaseListObservable` to `AngularFireList<T>`
6+
7+
Rather than `.list()` returning a `FirebaseListObservable`, it now returns an `AngularFireList<T>`. This service contains methods that allow you manipulate and stream data.
8+
9+
In the case of streaming back data, you now call one of the observable methods on `AngularFireList`.
10+
11+
### 4.0
12+
```ts
13+
constructor(afDb: AngularFireDatabase) {
14+
afDb.list('items').subscribe(console.log);
15+
}
16+
```
17+
18+
### 5.0
19+
20+
```ts
21+
constructor(afDb: AngularFireDatabase) {
22+
afDb.list<Item>('items').valueChanges().subscribe(console.log);
23+
}
24+
```
25+
26+
The same concepts apply to `FirebaseObjectObservable` to `AngularFireObject`.
27+
28+
## Moving away from `$key` and `$value`
29+
30+
In AngularFireDatabase 4.0 the snapshot was automatically unwrapped for you and metadata was placed in `$` property. The Firebase Database rejects any keys with `$` in them so this mechanism allowed us to provide you with important metadata alongside your actual data. However, persisting the object could be a pain in some cases as the SDK would reject any `$` based properties. In 5.0 we have moved away from `$` properties and we provide multiple observable methods for receiving the data.
31+
32+
Calling `.valueChanges()` returns an Observable without any metadata. If you are already persisting the key as a property then you are fine. However, if you are relying on `$key`, then you need to use `.snapshotChanges()` and transform the data with an observable `.map()`.
33+
34+
### 4.0
35+
```ts
36+
constructor(afDb: AngularFireDatabase) {
37+
afDb.object('items/1').subscribe(item => console.log(item.$key));
38+
}
39+
```
40+
41+
### 5.0
42+
```ts
43+
constructor(afDb: AngularFireDatabase) {
44+
afDb.object('items').snapshotChanges().map(action => {
45+
const $key = action.payload.key;
46+
const data = { key, ...action.payload.val() };
47+
return data;
48+
}).subscribe(item => console.log(item.key));
49+
}
50+
```
51+
52+
## Data manipulation methods
53+
54+
AngularFire 5.0 removes all custom observables which means their custom operators are gone as well. Instead of using custom operators on either a `FirebaseListObservable` or a `FirebaseObjectObservable`, use the methods on the service based APIs: `AngularFireList` and `AngularFireObject`. There is no resulting code change, but it worth pointing out.
55+
56+
### 4.0
57+
```ts
58+
constructor(afDb: AngularFireDatabase) {
59+
const listObservable = afDb.list('items');
60+
listObservable.push({ name: 'item' });
61+
listObservable.subscribe();
62+
}
63+
```
64+
65+
### 5.0
66+
```ts
67+
constructor(afDb: AngularFireDatabase) {
68+
const afList = afDb.list('items');
69+
afList.push({ name: 'item' });
70+
const listObservable = afList.snapshotChanges();
71+
listObservable.subscribe();
72+
}
73+
```

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "angularfire2",
3-
"version": "4.0.0-rc.3-exp.7",
3+
"version": "5.0.0-rc.0",
44
"description": "The official library of Firebase and Angular.",
55
"private": true,
66
"scripts": {

0 commit comments

Comments
 (0)