In my Cloud Firestore database, my top collection is called meters
, all the documents have custom numeric ids like 12345
, and each document has a subcollection called meterdata
and all the document ids for each of those are dates like 2019-12-14
.
In my meter-list.component.ts
I have
export class MeterListComponent implements OnInit {
meters: Observable<any[]>;
constructor(db: AngularFirestore) {
this.meters = db.collection(('meters'), ref=> ref.where("usagetoday", ">", 0)).valueChanges();
}
and in my meter-list.component.html
I have a loop
<div *ngFor="let meter of meters | async">
{{meter.id}}
{{meter.address}}
{{meter.usagetoday}}
{{meter.lastupdated}}
</div>
which returns a list of all the meters, with the address and a field which is updated daily with the latest usage.
I would like to be able to reference in the meter-list.component.html
a calculated field called morning
on each day's meterdata
document, but I'm not sure how to reference the subdocument.
I know that it is not {{meter[meter.id].['meterdata'][meter.lastupdated].morning}}
.
I also tried to include a line in the meter-list.component.ts
that would look like this.meterdata = db.collection('meters').doc(this.meters.id).collection('meterdata').doc(this.meters.lastupdated).valueChanges();
which would allow me to call *ngIf = "meterdata | async as meterdata"
inside the *ngFor
loop and include {{ meterdata.morning }}
, but that obviously doesn't work either.
I'd really appreciate any push in the right direction. Thank you!