My current challenge involves accessing data based on an id from Firebase, which comes back as an observable. Upon logging it to the console, I can confirm that the Observable is present. However, the issue arises when attempting to display this data on the front end using the async pipe, nothing shows up. Below are the functions I am using to access the necessary data:
this.tenancy$ = this._tenancy.getUserCurrentTenancy().valueChanges();
this.property$ = this.tenancy$.pipe(
flatMap(tenancy => this._property.getPropertyById(tenancy.property_id).valueChanges()),
map((property: any) => property)
);
Here is how I have attempted to access it visually:
<div class="rent-due">£{{(property$ | async)?.rent_pcm}}</div>
Unfortunately, nothing appears as mentioned. In addition, I have experimented with using:
*ngIf="property$ | async as property"