get array of maps key value pair in firestore in Angular

I have firestore structure like dB structure.How am I supposed to loop through all the key-value pair in each map and output in template using *ngFor and interpolation?

Or should I store all the maps inside an array and then access it? Like this guy did Get map data from Cloud Firestore ?

I’m new to firestore, help me out. This is code what I’m using to get "desc:xyz" in shortDesc document of home collection.
This is a service.

constructor(private http:HttpClient, private afs:AngularFirestore) {  }

    this.shortDesc = this.afs.collection("home").doc("shortDesc").valueChanges();
    return this.shortDesc;



  constructor(private serv:ServicesService) { }

  ngOnInit(): void {
    this.serv.getshortDescription().subscribe( data => {
      this.shortDescription = data;


export interface Details{

What should i do to get the key value pair of each map and output on component.html ?

Source: Angular Questions