Show Menu
Cheatography

angular-firebase Cheat Sheet (DRAFT) by

This is a draft cheat sheet. It is a work in progress and is not finished yet.

Toogller

<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
  <a class="navbar-brand" href="#">
    Brand
  </a>
  <button class="navbar-toggler" type="button"
          (click)="toggleNavbar()">
    <span class="navbar-toggler-icon"></span>
  </button>
  <div class="collapse navbar-collapse"
       [ngClass]="{ 'show': navbarOpen }">
    <ul class="navbar-nav mr-auto">
      <li class="nav-item">
        <a class="nav-link" href="#">Item 1</a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#">Item 2</a>
      </li>
    </ul>
  </div>
</nav>
--------------------------------------------------------------------------------------------------
  navbarOpen = false;
  toggleNavbar() {
    this.navbarOpen = !this.navbarOpen;
  }
 

Document

getProduct(id: number): Observable<Product> {
    const productsDocuments = this.db.doc<Product>('products/' + id);
    return productsDocuments.snapshotChanges()
      .pipe(
        map(changes => {
          const data = changes.payload.data();
          const id = changes.payload.id;
          return { id, ...data };
        }))
  }

Collection

getProduct(id: string): Observable<Product[]> {
    const productsDocuments = this.db.collection<Product[]>('products');
    return productsDocuments.snapshotChanges()
      .pipe(
        map(changes => changes.map(({ payload: { doc } }) => {
          const data = doc.data();
          const id = doc.id
          return { id, ...data };
        })),
        map((products) => products.find(doc => doc.id === id)))
  }
 

Add/Create A Document To Cloud Firestore


const db = firebase.firestore()
db.collection("users").add({
    name: "Anbu Selvan",
    email: "anbu.selvan@email.com",
    age: 25
}

db.collection("users")
.doc()
.set({
    name: "Anbu Selvan",
    email: "anbu.selvan@email.com",
    age: 25
})

Update A Document Data to Cloud Firestore

db.collection("users")
   .doc("3P86VJxcpBK0D0lsAyYx")
    .set({
        name: "Lee Kuan",
});

db.collection("users")
.doc("3P86VJxcpBK0D0lsAyYx")
.set(
    {
        name: "Anbu Selvan",
        age: 25
    },
    { merge: true }
);

Delete Data from Cloud Firestore

db.collection("users")
.doc("3P86VJxcpBK0D0lsAyYx")
.delete()
.then(function () {
    console.log("Document successfully deleted!");
}).catch(
    function(error) {
    console.error("Error removing document: ", error);
});

db.collection("users")
.doc("3P86VJxcpBK0D0lsAyYx")
.update({
    email.firestore.FieldValue.delete()
})

Pretty straight forward.

addUsersToFirestore() {
    var users = [{
            name: "Raja",
            email: "raja.tamil@email.com",
            createdAt: new Date("2019-01-01 12:08:00")
        },
        {
            name: "Arivu",
            email: "arivu.selvan@email.com",
            createdAt: new Date("2018-01-23 09:13:00")
        }, {
            name: "Mike",
            email: "mike.author@email.com",
            createdAt: new Date("2018-08-08 06:37:00")
        }, {
            name: "Praba",
            email: "praba.karan@email.com",
            createdAt: new Date("2018-10-09 18:26:00")
        },
        {
            name: "Muhammad",
            email: "muhammad.ali@email.com",
            createdAt: new Date("2018-03-13 12:13:00")
        }
    ];
    const db = firebase.firestore();
    users.forEach(user => {
        db.collection("users").doc().set(user);
    });
}

Get Documents Data from Firestore Database

 
db.col­lec­tio­n("u­ser­s")
.get()
.then(snap => {
snap.f­orE­ach(doc => {
consol­e.l­og(­doc.da­ta());
consol­e.l­og(­doc.id);
});
});


db.col­lec­tio­n("u­ser­s")
.onSna­pshot()
.then(snap => {
snap.f­orE­ach(doc => {
consol­e.l­og(­doc.da­ta());
});
});

Get A Single Document Data

db.collection("users")
.doc("cAwTiq7IYKAbFGnhgKT3")
.get()
.then(doc => {
    console.log(doc.data())
})

Get Data from Sub-co­lle­ction in Firestore

db.collection("users")
.doc("cAwTiq7IYKAbFGnhgKT3")
.collection("posts")
.get()
.then(snap => {
    snap.forEach(doc => {
        console.log(doc.data());
    });
});




db.collection("users")
.doc("cAwTiq7IYKAbFGnhgKT3")
.collection("posts")
.doc("BjLZHiuQfVQVOu9nEG7k")
.get()
.then(snap => {
    console.log(snap.data());
});

Firestore Single­/Mu­ltiple Where Query Filter

db.collection("users")
.where("age", "<=", 30)
.get()
.then(snap => {
    snap.forEach(doc => {
        console.log(doc.data());
    });
});


db.collection("users")
    .where("age", "<=", 30)
    .where("age", ">=", 20)
    .get()
    .then(snap => {
        snap.forEach(doc => {
            console.log(doc.data());
        });
    });


db.collection("users")
.where("age", ">=", 20)
.where("gender", "==", "fmale")
.get()
.then(snap => {
    snap.forEach(doc => {
        console.log(doc.data());
    });
});

OrderBy and Limit Filters

 
db.col­lec­tio­n("u­ser­s")
.where­("ag­e", "­>=", 20)
.order­By(­"­age­", "­des­c")
.get()
.then(snap => {
snap.f­orE­ach(doc => {
consol­e.l­og(­doc.da­ta());
});
});


db.col­lec­tio­n("u­ser­s")
.where­("ag­e", "­>=", 20)
.order­By(­"­age­", "­des­c")
.limit(2)
.get()
.then(snap => {
snap.f­orE­ach(doc => {
consol­e.l­og(­doc.da­ta());
});
});

Collection Group Queries

users/{userID}/posts/{postID}

db.collectionGroup("posts")
.where("publishedAt", ">=", new Date("2018-01-01 00:00"))
.where("publishedAt", "<=", new Date("2018-12-31 23:59"))
.get()
.then(snap => {
    snap.forEach(doc => {
        console.log(doc.data());
    });
});

service cloud.firestore {
  match /databases/{database}/documents {
    match /{document=**} {
      allow read, write;
    }
  }


var cities = [];
const cityRef = firebase.firestore().collection("cities")
var lastVisibleCitySnapShot = {};

const query = await this.cityRef.orderBy("city").limit(10);
query.get().then(snap => {
  snap.forEach(doc => {
    this.cities.push(doc.data());
  });
  this.lastVisibleCitySnapShot = snap.docs[snap.docs.length - 1];
});


async next() {
  this.cities = [];
  const query = await this.cityRef
    .orderBy("city")
    .startAfter(this.lastVisibleCitySnapShot)
    .limit(10);
  query.get().then(snap => {
    snap.forEach(doc => {
      this.cities.push(doc.data());
    });
    this.lastVisibleCitySnapShot = snap.docs[snap.docs.length - 1];
  });
}


async prev() {
  this.cities = [];
  const query = await this.cityRef
    .orderBy("city")
    .endBefore(this.lastVisibleCitySnapShot)
    .limit(10);
  query.get().then(snap => {
    snap.forEach(doc => {
      this.cities.push(doc.data());
    });
    this.lastVisibleCitySnapShot = snap.docs[snap.docs.length - 1];
  });
},

Support Cheatography!