Infinit Loop With Firebase And Angular

I'm having an infinit loop problem saving my data on firebase with this.db.collection('users').doc(this.useruid).update({Info: this.currentInfo}) private currentInfo:string[]; priv

Solution 1:

To update a document based on its current value, use a transaction:

var userDocRef = collection('users').doc(this.useruid);

return db.runTransaction(function(transaction) {
    // This code may get re-run multiple times if there are conflicts.
    return transaction.get(userDocRef).then(function(userDoc) {
        if (!userDoc.exists) {
            throw "Document does not exist!";
        }

        const data = userDoc.data() as {name:string, Info:string[]};
        data.Info.forEach(element => {
          this.currentInfo.push(element);
        });
        this.currentInfo.push(text);

        transaction.update(userDocRef, { Info: this.currentInfo });
    });
}).then(function() {
    console.log("Transaction successfully committed!");
}).catch(function(error) {
    console.log("Transaction failed: ", error);
});

In addition to preventing the infinite loop that you currently have, this also prevents multiple users from overwriting each other's results if they want to update the document at almost the same time.

Solution 2:

You can use pipe and first to get the values that you need and then update again.

sendInfo(text: string) {
    this.useruid = this.AngularAuth.auth.currentUser.uid;
    this.db.collection('users').doc(this.useruid).valueChanges().pipe(first()).subscribe(a => {
        const data = a.payload.data() as {name:string, Info:string[]};
        data.Info.forEach(element => {
            this.currentInfo.push(element);
        });
        this.currentInfo.push(text);
    }
    this.db.collection('users').doc(this.useruid).update({
        Info: this.currentInfo
    })
}

The first method of rxjs is used to get the first value emitted by an observable. After that, it unsubscribes from the observable.