title: Loop through the key and value of an array object in HTML
body: <p>I have an array Object like this: <code>[key1:Array[3], key2:Array[1], key3:Array[3]]</code>. 
  I want to display the keys and values in HTML like this: </p>
  
  <pre><code>key1 
  item1 item2 item3
  key2
  item4
  key3
  item5 item6 item7
  </code></pre>
  
  <p>When I open the object, I just see </p>
  
  <pre><code>Array[0]
    &gt;key1:Array[3]
    &gt;key2:Array[1]
    &gt;key3:Array[3]
  </code></pre>
  
  <p>I am using javascript with Angular2 and this is my attempt to access the array (which I found it in another stackover flow post)</p>
  
  <pre><code>&lt;li *ngFor="let k of keysArray"&gt;
     &lt;span *ngFor="let v of generateArray(k)"&gt; {{v}} &lt;/span&gt;
  &lt;/li&gt;
  generateArray(obj){
     return Object.keys(obj).map((key)=&gt;{ return obj[key]});
  }
  </code></pre>
  
  <p>But I am still not able to display either keys or values on HTML. </p>