read values from firestore document ionic

Question

I have a service which fetches a particular document from firestore using this method

getBidremains(userId: string){ return this.firestore.collection('userProfile').doc(userId);

In the typscript class I am calling this method in ngOnInit as this.userInfo = this.firestoreService.getBidremains(userid).valueChanges().subscribe(data => console.log(data));

In the console I can see the data is fetched correctly, but when i try to use this.userInfo.remainBids it prints nothing. In the console it shows as undefined.

But in the html file( after removing .subscribe) i am able to print the correct value from firebase using {{ (userInfo | async)?.remainBids}} Can someone please help me out here, not sure what is it that I am doing wrong. I want to fetch the document and be able to read values of the field contained in the document.

firestore database document fields are simple it contains email, name and other fields

This is firestore service function name is getBidremains(userId: string)

This is the typescript class where the call is made this.userInfo = this.firestoreService.getBidremains(userid).valueChanges().subscribe(data => console.log(data));

please show us the code from your service and page/component — Patric, Jul 14 '20 at 08:41
Thank you, assigning the variable inside the subscribe function did work!!! — Kaustubh pande, Jul 14 '20 at 10:54
On Stack Overflow, please don't show images of code and text. Copy the code into the question itself and format it so that it's easy to read. — Doug Stevenson, Jul 14 '20 at 16:28

score 1 · Accepted Answer · answered Jul 14 '20 at 08:57

.subscribe() method returns a Subscription

If you need this.userInfo.remainBids to have the remaining bids, use it inside the subscribe method()

this.userInfoSubscription = this.firestoreService.getBigremains(userid).valuechanges().subscribe(data => {
    this.userInfo = data;
});

Also, don't forget to unsubscribe the Subscription inside ngOnDestroy.

score 1 · Answer 2 · answered Jul 14 '20 at 09:01

The userinfo variable is assigned to a Subscription, which does not have a remainBids property. You either need to assign the variable inside the subscribe, like this:

...subscribe(data => {this.userInfo = data})

or make your userInfo variable an Observable and assign it like this:

this.userInfo = this.firestoreService.getBigremains(userid).valuechanges()

read values from firestore document ionic

2 Answers2