ng add @angular/fire+
ng add @angular/fire@nextAngularFire smooths over the rough edges an Angular developer might encounter when implementing the framework-agnostic [Firebase JS SDK](https://github.com/firebase/firebase-js-sdk) & aims to provide a more natural developer experience by conforming to Angular conventions. @@ -14,13 +14,25 @@ AngularFire smooths over the rough edges an Angular developer might encounter wh - **Google Analytics** - Zero-effort Angular Router awareness in Google Analytics - **Router Guards** - Guard your Angular routes with built-in Firebase Authentication checks +--- + +> **WARNING**: This branch is the work in progress for version 7 of AngularFire. [You can find version 6 here](https://github.com/angular/angularfire/tree/v6), if you're looking for documentation or to contribute to stable. + +--- + ## Example use ```ts import { Component } from '@angular/core'; -import { AngularFirestore } from '@angular/fire/firestore'; +import { Firestore, collectionData, collection } from '@angular/fire/firestore'; import { Observable } from 'rxjs'; +interface Item { + id: string, + name: string, + ... +}; + @Component({ selector: 'app-root', template: ` @@ -32,9 +44,10 @@ import { Observable } from 'rxjs'; ` }) export class MyApp { - item$: Observable
v6 / Compat | +v7 Modular | +|
---|---|---|
AngularFirestore | +doc | ++ +```ts +import { doc } from '@angular/fire/firestore' +``` + | +
collection | ++ +```ts +import { collection } from '@angular/fire/firestore' +``` + | +|
collectionGroup | ++ +```ts +import { collectionGroup } from '@angular/fire/firestore' +``` + | +|
AngularFirestoreDocument | +set | ++ +```ts +import { setDoc } from '@angular/fire/firestore' +``` + | + + +
update | ++ +```ts +import { updateDoc } from '@angular/fire/firestore' +``` + | +|
delete | ++ +```ts +import { deleteDoc } from '@angular/fire/firestore' +``` + | +|
collection | ++ +```ts +import { collection } from '@angular/fire/firestore' +``` + | +|
snapshotChanges | ++ +```ts +import { docSnapshots } from '@angular/fire/firestore' +``` + | + + +|
valueChanges | ++ +```ts +import { docData } from '@angular/fire/firestore' +``` + | +|
get | ++ +```ts +import { get } from '@angular/fire/firestore' +``` + + | +|
+ AngularFirestoreCollection+Notes + |
+ a | ++ +```ts +import { collectionGroup } from 'firebase/firestore' +``` + | +
a | ++ +```ts +import { collectionGroup } from 'firebase/firestore' +``` + | +|
a | ++ +```ts +import { collectionGroup } from 'firebase/firestore' +``` + | +|
a | ++ +```ts +import { collectionGroup } from 'firebase/firestore' +``` + | +|
a | ++ +```ts +import { collectionGroup } from 'firebase/firestore' +``` + | +|
a | ++ +```ts +import { collectionGroup } from 'firebase/firestore' +``` + | +|
a | ++ +```ts +import { collectionGroup } from 'firebase/firestore' +``` + | +
{{ (myDocData | async)?.data() | json }}