javascript - Get nested data from Firebase in angular

Question

I have a database structure in Firebase like this:

{
    "2021-01-07" : {
        "1HKI7hxBSVVB4vNf6tz1bqqxXx33" : {
            "info" : {        
                "status" : "present"
            },
            "shifts" : {
                 "h00" : 0
            }
        },
        "1jXahskAxtYsBwqTsxAc2u4gCEz2" : {
            "info" : {
                "status" : "present"
            },
            "shifts" : {
            "h00" : 0
            }
        }    
    },
    "2021-01-08" : {
        "1HKI7hxBSVVB4vNf6tz1bqqxXx33" : {
            "info" : {
                "status" : "present"
            },
            "shifts" : {
                "h00" : 0
            }
        },
        "1jXahskAxtYsBwqTsxAc2u4gCEz2" : {
            "info" : {
                "status" : "present"
            },
            "shifts" : {
                "h00" : 0
            }
        }
    }
}

I'm trying to get this data into the app in a service component:

getStats(): AngularFireList<ActivityModel> {
return this.db.list(`/activity/data/`, ref => ref.orderByKey().startAt('2021-01-07').endAt('2021-01-08'));
}

And the ActivityModel is:

export class ActivityModel {
    key: string;
    shifts?: ShiftsModel;
    info?: InfoModel;
}

export class ShiftsModel {
    h00: number;
}

export class InfoModel {
    status: string;
}

then in my app component, I'm trying to get this data:

retrieveStats(): void {
this.db.getStats().snapshotChanges().pipe(
  map(changes =>
    changes.map(c =>
      ({ key: c.payload.key, ...c.payload.val() })
    )
  )
).subscribe(data => {
  console.log(data)
});

}

How can I pull all the nested data into a list of ActivityModel. I'm quite new to angular.

Answer 1

等待大神答复