title: How do I iterate a Http response object as Key Value pair?
body: <p>I have a below response from HTTP</p>
  <pre><code>getEmployee(id: number){
      this.empservice.getEmployee(id)
        .subscribe({
        next:(res)=&gt;{
          this.obj = res;
        },
        error:(err)=&gt;{
          alert(&quot;Error getting the employee&quot;);
          console.warn(err);
        }
      })
    }
  </code></pre>
  <p>I want to iterate the response in to a HTML Table or MAT table.</p>
  <pre><code>&lt;table mat-table [dataSource]=&quot;obj&quot;&gt;
          &lt;tbody&gt;
              &lt;tr data-ng-repeat=&quot;(key, val) in obj[0]&quot;&gt;
                  &lt;th&gt;
                      {{ key }}
                  &lt;/th&gt;
                  &lt;td data-ng-repeat=&quot;row in obj&quot;&gt;
                      {{ rowSource[key] }} 
                  &lt;/td&gt;
              &lt;/tr&gt;
          &lt;/tbody&gt;
        &lt;/table&gt;
  </code></pre>
  <p>Below is the response object that i get from API</p>
  <pre><code>{
      &quot;employeeID&quot;: 999,
      &quot;firstName&quot;: &quot;Peter&quot;,
      &quot;lastName&quot;: &quot;Scotch&quot;,
      &quot;phone&quot;: &quot;8878767654&quot;,
      &quot;email&quot;: &quot;kumar@yahoo.com&quot;,
  }
  </code></pre>