angular2 NgFor only supports binding to Iterables such as Arrays
<p>Angular2 rc.6</p>
<p>I am getting following error when running a loop on json data</p>
<p>core.umd.js:5995 EXCEPTION: Error in app/modules/mbs/components/menu.html:5:4 caused by: Cannot find a differ supporting object '[object Object]' of type 'object'. NgFor only supports binding to Iterables such as Arrays.</p>
<p>my html loop, <strong>Note</strong>: I simply want to iterate properties and arrays inside the response.</p>
<pre><code>&lt;li *ngFor=&quot;let item of menuItems&quot;&gt;
{{item}}
&lt;/li&gt;
</code></pre>
<p>my service method</p>
<pre><code>getMenuItems():Promise&lt;any&gt;{
    return this.http.get('api/menu').toPromise().
    then(response =&gt; response.json())
        .catch(this.handleError)

}
</code></pre>
<p>following is my json response</p>
<pre><code>{  
&quot;text&quot;:&quot;Menu&quot;,
   &quot;children&quot;:[
      {
         &quot;text&quot;:&quot;Home&quot;,
         &quot;url&quot;:&quot;/spatt-web/home&quot;
      },
      {
         &quot;text&quot;:&quot;Configure&quot;,
         &quot;children&quot;:[
            {
               &quot;text&quot;:&quot;Tri-Party Program&quot;,
               &quot;children&quot;:[
                  {
                     &quot;text&quot;:&quot;Margins and Filters&quot;,
                     &quot;url&quot;:&quot;/sp-rrp/config/operation&quot;
                  },
                  {
                     &quot;text&quot;:&quot;Fields and Desirability&quot;,
                     &quot;url&quot;:&quot;/spatt-rrp/config/program&quot;
                  }
               ]
            },
            {
               &quot;text&quot;:&quot;Shared Settings&quot;,
               &quot;url&quot;:&quot;/shared-config/config&quot;
            },
            {
               &quot;text&quot;:&quot;SOMA Limits&quot;,
               &quot;url&quot;:&quot;/outright-config/config&quot;
            }
         ]
      },
      {
         &quot;text&quot;:&quot;Plan&quot;,
         &quot;children&quot;:[
            {
               &quot;text&quot;:&quot;Tri-Party RRP Operations&quot;,
               &quot;url&quot;:&quot;/spatt-rrp/plan&quot;
            }
         ]
      },
      {
         &quot;text&quot;:&quot;Track&quot;
      },
      {
         &quot;text&quot;:&quot;Administer&quot;
      },
      {
         &quot;text&quot;:&quot;Help&quot;,
         &quot;children&quot;:[
            {
               &quot;text&quot;:&quot;RRP Operations&quot;,
               &quot;url&quot;:&quot;RRPference&quot;
            },
            {
               &quot;text&quot;:&quot;RRP Margin Calls and Recalls&quot;,
               &quot;url&quot;:&quot;RRPRecallference&quot;
            }
         ]
      }
   ]
}
</code></pre>