Questions tagged [angularfire2]
AngularFire is the officially supported Angular binding for Firebase. The combination of Angular and Firebase provides a three-way data binding between your HTML, your JavaScript, and the Firebase database. This tag is for binding with Angular2+. Don't use this tag for binding with AngularJS.
2,889
questions
131
votes
11answers
208k views
NullInjectorError: No provider for AngularFirestore
I'm learning Angular looking for help in fixing the error:
I'm following this link : https://github.com/angular/angularfire2/blob/master/docs/install-and-setup.md
to create a angular small app with ...
76
votes
5answers
32k views
Firestore slow performance issue on getting data
I'm having slow performance issues with Firestore while retrieving basic data stored in a document compared to the realtime database with 1/10 ratio.
Using Firestore, it takes an average of 3000 ms ...
64
votes
1answer
19k views
Firebase query if child of child contains a value
The structure of the table is:
chats
--> randomId
-->--> participants
-->-->--> 0: 'name1'
-->-->--> 1: 'name2'
-->--> chatItems
etc
What I am trying to do is query the chats table to find all the ...
50
votes
4answers
16k views
Google Domain - DNS Configuration for Firebase Hosting - Connect Domain
I am trying to connect my firebase app in to a domain -where the domain purchesd from google.Need help to to do the setup for DNS configuration.
my app is working fine in firebase app.
firebase app is ...
47
votes
9answers
84k views
Firestore Getting documents id from collection
I'm trying to retrieve my documents with id but can't figure it out.
Currently I retrieve my documents like this :
const racesCollection: AngularFirestoreCollection<Races> = this.afs....
44
votes
5answers
109k views
Angular 4: InvalidPipeArgument: '[object Object]' for pipe 'AsyncPipe'
i need your help, i'm trying to display some datas from my firebase but it trhows me an error like InvalidPipeArgument: '[object Object]' for pipe 'AsyncPipe'.
There is my service:
import { ...
39
votes
2answers
28k views
Use case of Observable .do() operator (rxjs)
Context :
I'm building an angular 2 app (with a Firebase API). I'm using the AngularFire module. I was wondering how I can mix the canActivate method with the AngularFire auth Observable, and I found ...
35
votes
2answers
15k views
Many to Many relationship in Firebase
I have a Firebase database. I have Companies and Contractors. A Contractor can work for more than one Company and a Company can have multiple Contractors. This is a straightforward many to many ...
32
votes
5answers
44k views
No provider for AngularFireDatabase, AngularFireAuth
Apologies as I can't think of a better way of including all the information... When I run this, I get an error saying the following. I've followed the Ionic Docs to the T, I can't figure out what ...
26
votes
3answers
9k views
Leaderboard ranking with Firebase
I have project that I need to display a leaderboard of the top 20, and if the user not in the leaderboard they will appear in the 21st place with their current ranking.
Is there efficient way to this?...
26
votes
5answers
18k views
How do you insert a “reference” value into firestore?
I'm trying to insert a document into a collection. I want the document to have a attribute of type reference to insert into the collection. But every time I insert into the collection, it comes out as ...
22
votes
4answers
8k views
EXCEPTION: This browser is not supported or 3rd party cookies and data may be disabled
This error occurs when our users "Block third-party cookies and site data".
To replicate the error, go to:
Check your Chrome browser "Block third-party cookies and site data" reference in this ...
21
votes
9answers
17k views
Identifier 'required' is not defined. '__type' does not contain such a member
I need to declare this variable to type any? This shows up in my visual code editor in my HTML template.
product-form.component.html
<div class="row">
<div class="col-md-6">
<...
21
votes
3answers
15k views
Using AngularFirestore Collection orderBy with snapShotChanges method
I have below code in an Angular application which is using AngularFire2.
TypeScript:
constructor(db: AngularFirestore) {
this.booksCollectionRef = db.collection<Book>('books');
this....
21
votes
1answer
11k views
How to assign an initial value to Subject RxJS observable?
I'm developing an Angular 2 app, I need make changeable the order of my columns in a List, clicking on the title (as data-table works) and I get an idea from Angularfire 2 documentation examples, here ...
21
votes
2answers
6k views
Angular 2 AuthGuard + Firebase Auth
I'm trying to build an AuthGuard for Angular 2 routes using Firebase Auth.
This is the AuthGuard Service:
import { Injectable } from '@angular/core';
import { CanActivate, Router,
...
20
votes
5answers
10k views
ERROR in ./~/firebase/app/shared_promise.js
I'm trying to create an Angular 2 App with AngularFire2
I was following this guide.
Everytime I try to import the AngularFireModule in my app module and then do AngularFireModule.initializeApp(...
20
votes
4answers
24k views
Observable.forkJoin() doesn't execute
I have the following code:
//Loop: For each user ID/Role ID, get the data
userMeta.forEach((businessRole) => {
Observable.forkJoin(
af.database.object('/roles/'+businessRole.$value),
af....
20
votes
2answers
12k views
Accessing firebase.storage() with AngularFire2 (Angular2 rc.5)
I am trying to access firebase.storage() on my project, with:
"@angular": "2.0.0-rc.5"
"angularfire2": "^2.0.0-beta.3-pre2"
"firebase": "^3.3.0"
I found this solution, and created my .component.ts ...
20
votes
7answers
14k views
Firestore: Add Custom Object to db
Good Morning,
I tried adding a new created object from this class:
export class Sponsor implements ISponsor {
title: string;
description?: string;
creation: ICreation;
constructor(...
19
votes
6answers
30k views
What's the best way to check if a Firestore record exists if its path is known?
Given a given Firestore path what's the easiest and most elegant way to check if that record exists or not short of creating a document observable and subscribing to it?
17
votes
4answers
18k views
Uncaught (in promise): Error: No provider for AngularFireAuth
We are tried login with google authentication using (Firebase/ionic2/angularjs2).Our code
import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { ...
17
votes
3answers
11k views
Firebase error messages in different languages?
Showing the Firebase error messages (error.message) in the view results in english error descriptions (e.g. for Authentication errors, if user credetials contain errors).
How would you display the ...
17
votes
1answer
679 views
Display duplicate events after update firestore data, but the data itself in firestore isn't duplicated
I have a web application(Angular) and mobile application(Ionic). Both of them share the same Firestore data.
Use web application update existing data but the ionic app shows duplicate items(the ...
16
votes
8answers
40k views
“ERROR TypeError: Object(…) is not a function” using AngularFirestore and firebase
I want to use firebase and angularfire2 in my app, first of all, I installed them, and for the declarations:
in environment.ts
export const environment = {
production: false,
firebase: {
...
16
votes
3answers
5k views
Access parent documents field in Firestore rules
I'm implementing a recipe book in Firestore where every user is able to see all the recipes all users created but only the original author of the recipe is allowed to edit or delete the recipe. Any ...
15
votes
1answer
5k views
Angular 2 Firebase Observable to promise doesn't return anything
I'm currently working on an Angular 2 project with AngularFire2 and I'm trying to convert a FirebaseListObservable to a Promise. I know that it doesn't make much sense since Observables are more ...
15
votes
2answers
2k views
Using Firebase emulator with AngularFire
I am trying to use the freshly introduced Firestore emulator in my Angular7 application.
According to this documentation, I run the dev server on 127.0.0.1:8080 with :
firebase serve --only ...
15
votes
2answers
3k views
How to mock AngularFire 2 service in unit test?
I'm trying to set up unit tests for a sample Angular 2 app using AngularFire 2 auth, the component is fairly simple:
import { Component } from '@angular/core';
import { AngularFire, AuthProviders } ...
15
votes
3answers
3k views
Firestore transaction with multiple get
I'm trying to run a transaction with a variable number of read operations.
I put the read () operations before than update ().
Reading the Firestore doc on https://cloud.google.com/firestore/docs/...
14
votes
1answer
19k views
'await' expression is only allowed within an async function
I have an async method like below. It shows an error [ts] 'await' expression is only allowed within an async function. here await userProfile.set({. Can you tell me how to sort out it?
Note: Maybe it ...
14
votes
2answers
9k views
Why does this firestore query require an index?
I have a query with a where() method with an equality operator and then an orderBy() method and I can't figure out why it requires an index.
The where method checks for a value in an object (a map) ...
14
votes
3answers
19k views
/angularfire2/index has no exported member 'AngularFire'
Can't fix this problem:
app.component.ts
import { AngularFire, AuthProviders, AuthMethods } from 'angularfire2';
/angularfire2/index has no exported member 'AngularFire',
/angularfire2/index has no ...
14
votes
2answers
714 views
Firestore: Passing angularfire2 async data as Ionic 3 navParams not working
cities: Observable<any>;
this.cities = this.fsProvider.collection('cities').map(cities => {
return cities.map(city => {
city.country = this.fsProvider.doc(`countries/${city....
14
votes
1answer
7k views
ValueChanges & SnapshotChanges, don't get the full lists anymore with Firebase AngularFire2
We've been having some serious problems with the recent changes to how AngularFire treats objects/lists and referencing the objects throughout our app.
The primary thing is how the old ...
13
votes
8answers
7k views
Angular 4, angularfire2, Metadata version mismatch
I've got the following error
Metadata version mismatch for module c:/..../node_modules/angularfire2/index.d.ts, found version4, expected 3.
And if I go and check in my package.json, I have ...
13
votes
11answers
39k views
TypeError: Object(…) is not a function
working on ionic3, angularfire2 v5
TypeError: Object(...) is not a function
at SwitchMapSubscriber.project (http://localhost:8100/build/vendor.js:73935:76)
at SwitchMapSubscriber._next (http:/...
13
votes
4answers
9k views
Using Firebase reauthenticate
I'll appreciate assistance with how to reauthenticate a user in Firebase. I wonder if it makes any sense adding all these great features if the documentation doesn't explain how to use it:
Currently, ...
13
votes
2answers
3k views
Firebase Realtime Database currently gives TRIGGER_PAYLOAD_TOO_LARGE error
Since this morning, our Firebase application has a problem when writing data to the Realtime Database instance. Even the simplest task, such as adding one key-value pair to an object triggers
Error: ...
13
votes
1answer
3k views
Three way binding in Angular 2 and Angularfire2
I am trying to three-way bind an input element to firebase database in Angular.js 2 (2.0.0-rc.4), using AngularFire 2 (2.0.0-beta.2).
I have a very simple html like:
<form (ngSubmit)="onSubmit()" ...
13
votes
4answers
3k views
Function calls are not supported in decorators but 'AngularFireModule' was called
I am using Firebase as a database for my Angular 5 application. I am able to build, run, and deploy the project using ng build. However, when I build using the --prod flag, I get the following error....
12
votes
4answers
35k views
How to get firestore timestamp
I'm trying to get the timestamp of a document that I created in firestore, but what I get is this:
myService.ts
getDomiciliarios() {
this.domiciliarios = this.afs.collection('domiciliarios')....
12
votes
3answers
2k views
How to get access to native Firebase object when using angularfire2?
I'm using AngularFire2 (2.0.0-beta.2) incombination with angular2 (2.0.0-rc.4). I'd like to get access to the native firebase object (not the AngularFire root object) from Angularfire2.
Within my ...
12
votes
1answer
13k views
Getting Data out of Firebase Object with Angular2, angularfire2 and Typescript
Im currently working on a Project with Angular 2 and angularFire2.
My database looks like this in Firebase:
base:/data
[{Name:test1},
{Name:test2},
{Name:test3}]
All of the items also have the ...
11
votes
4answers
11k views
Cannot find module '@firebase/app-types/private' - Firebase throws error
I am working on application using angular and firebase. I installed firebase with the instructions given on site and the versions as follows,
"angularfire2": "^5.0.0-rc.4",
"firebase": "^4.8.1",
...
11
votes
3answers
26k views
Getting an error: “Has no exported member AngularFire, AuthProviders, AUthMethods, FirebaseListObservable” in AngularFire2?
I am new to Angular 4, so I am creating a firebase chat app with Angular 4, and then when I import some modules like this:
import { AngularFire, AuthProviders, AuthMethods,FirebaseListObservable } ...
11
votes
3answers
14k views
What is snapshotchanges in firestore
this function is called by the constructor. can someone explain in depth to me what it does?
initializeItems(){
this.travelList$ = this.plsdala.getTravelList()
.snapshotChanges()
.map(
changes =&...
11
votes
2answers
2k views
AngularFire2 - Setting custom key when pushing
I am learning angularfire2 in Ionic2
const newUser = this._db.list('/users');
setTimeout(() => {
newUser.push(this.userInfo)
.then((data) => console.log(data))
},3000)
I want to ...
11
votes
1answer
2k views
Joining Flattened Data
i'd like to join the data on init from my customers table into the projects list.
Model is like this:
projects
key
name: string
customer : customerKey
customers
key
name: string
Do ...
10
votes
7answers
17k views
How to use snapshotChanges() method to get both key value and filter the data?
I'm working on an Angular Firebase Project, where I need to filter my database as well get the key values. Currently I'm using valueChanges() method in my service code (inside getUnreadBooks and ...
