I am new to angular 5 and trying to iterate the map containing another map in typescript.
How to iterate below this kind of map in angular
below is code for component:

import { Component, OnInit} from '@angular/core';



@Component({

  selector: 'app-map',

  templateUrl: './map.component.html',

  styleUrls: ['./map.component.css']

})

export class MapComponent implements OnInit {

  map = new Map<String, Map<String,String>>();

  map1 = new Map<String, String>();



  constructor() { 





  }



  ngOnInit() {

    this.map1.set(sss,sss);

    this.map1.set(aaa,sss);

    this.map1.set(sass,sss);

    this.map1.set(xxx,sss);

    this.map1.set(ss,sss);





    this.map1.forEach((value: string, key: string) => {

      console.log(key, value);



    });





    this.map.set(yoyoy,this.map1);



  }







}

and its template html is :

<ul>

  <li *ngFor=let recipient of map.keys()>

    {{recipient}}

   </li>





</ul>



<div>{{map.size}}</div>