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.
angularfire2
3,129
questions
217
votes
12
answers
458k
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 ...
- 2,469
85
votes
5
answers
45k
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 ...
- 953
80
votes
1
answer
30k
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 ...
- 855
76
votes
10
answers
182k
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....
- 1,361
59
votes
7
answers
176k
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 { ...
- 603
57
votes
2
answers
61k
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) ...
- 707
53
votes
1
answer
118k
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 ...
- 65.2k
51
votes
5
answers
46k
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 ...
- 4,630
46
votes
2
answers
40k
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 ...
- 4,465
46
votes
3
answers
27k
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 ...
- 3,624
40
votes
8
answers
75k
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?
- 3,856
37
votes
7
answers
19k
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?...
- 599
35
votes
5
answers
46k
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....
- 24.2k
34
votes
6
answers
48k
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 ...
- 491
34
votes
7
answers
11k
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 ...
- 1,945
33
votes
2
answers
30k
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 ...
- 597
33
votes
6
answers
24k
views
Property 'code' does not exist on type 'Error'
How can I access the Error.code property?
I get a Typescript error because the property 'code' does not exist on type 'Error'.
this.authCtrl.login(user, {
provider: AuthProviders.Password,
...
- 667
31
votes
3
answers
26k
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....
- 11.4k
29
votes
3
answers
9k
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 ...
- 1,070
26
votes
4
answers
22k
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 ...
- 703
25
votes
10
answers
24k
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(...
- 521
24
votes
6
answers
13k
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 ...
- 5,616
23
votes
8
answers
15k
views
NullInjectorError: No provider for InjectionToken angularfire2.app.options! 2021
Okay I just started using angular firebase and I've been scratching my head for two days. Most of the tutorials out there are mostly for older versions of firebase
this is the error that I am ...
- 238
22
votes
3
answers
31k
views
Error TS2344: Type 'T[K]' does not satisfy the constraint
I am having a weird issue with my angular application, I just added AngularFire to my project, however when I try to put it up, it displays the following error:
ERROR in nodae_modules/@angular/fire/...
- 564
21
votes
10
answers
24k
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">
<...
- 655
21
votes
2
answers
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 ...
- 215
21
votes
3
answers
7k
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,
...
- 1,671
20
votes
8
answers
22k
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, ...
- 9,430
19
votes
5
answers
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(...
- 193
19
votes
8
answers
47k
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: {
...
- 1,638
19
votes
4
answers
81k
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')....
- 2,235
19
votes
3
answers
6k
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/...
- 191
19
votes
1
answer
8k
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 ...
- 8,610
18
votes
3
answers
23k
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 =&...
- 327
18
votes
3
answers
5k
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 } ...
- 3,976
17
votes
2
answers
7k
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 ...
- 195
17
votes
4
answers
22k
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 { ...
- 635
17
votes
1
answer
1k
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 ...
- 31.2k
16
votes
5
answers
26k
views
How to know whether the Register Email is verified or not in Firebase?
onSubmit(formData) {
if(formData.valid) {
console.log(formData.value);
this.af.auth.createUser({
email: formData.value.email,
password: formData.value.password
}).then(
authState =&...
- 945
16
votes
4
answers
18k
views
Display loading while using Observable with Async pipe in template
Situation: I am using FirebaseObjectObservable to populate my Ionic 2 (rc0) template.
Template code:
<ion-card-content>
<p>{{(course | async)?.description}}</p>
<br>
&...
- 2,344
15
votes
8
answers
27k
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 ...
- 457
15
votes
2
answers
6k
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: ...
- 628
15
votes
3
answers
20k
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 ...
- 153
15
votes
2
answers
762
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....
- 2,940
14
votes
6
answers
11k
views
How to add timestamp to every collection insert,update in Cloud Functions for firestore database
I have a firestore collection called Posts
I make an insert on the client side and it works.
I want to add the createdAt and updatedAt fields to every insert in my posts collection firestore using ...
- 1,778
14
votes
4
answers
17k
views
Firestore: How to query a map object inside a collection of documents?
My objective:
The web app (similar to Google Drive) has 2 screens.
First screen is 'My Story' which displays all the story documents whom I'm the owner.
Second screen is 'Shared with me' which ...
- 5,616
14
votes
2
answers
2k
views
AngularFireAuth emulator login is lost on page reload
My Angular project successfully uses the AngularFireAuth injectable from @angular/fire to connect to a local Firebase authentication emulator. I used these sources as references for my implementation:
...
- 554
13
votes
8
answers
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 ...
- 201
13
votes
2
answers
10k
views
Angular2 - Change detection not showing unless clicked
I have an component in which you can enter some search terms and it will filter the content using a *ngFor loop. The trouble is when I enter a search term I need to click the screen for the update to ...
- 2,425
13
votes
11
answers
45k
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:/...
- 987