title: Dynamic table header with subheaders
body: <p>How to create (with angular) dynamical table header where header cells should have some subheader cells not equal to header cells?</p>
  
  <p>My table is: </p>
  
  <pre><code>var table = [{
  header: "a", 
  subheaders: "a1", "a2"
  }, { 
  header: "b", 
  subheaders: "b1", "b2", "b3" 
  }]
  </code></pre>
  
  <p>I try to create such table header (table data will have separate controller): </p>
  
  <pre><code>|a    |b       |
  |a1|a2|b1|b2|b3|
  </code></pre>
  
  <p>I use ng-repeat and everything is ok with headers (when i do <code>&lt;tr ng-repeat="head in table"&gt;&lt;th&gt;{{head.header}}&lt;/th&gt;&lt;/tr&gt;</code>), but when I try to do the same with subheaders, ng-repeat repeats whole array of subheaders and I am missing some pseudo element of table or smth...</p>
  
  <p>And I get </p>
  
  <pre><code>|a   |b     |
  |a1a2|b1b2b3|
  </code></pre>
  
  <p>here is my code: <a href="http://plnkr.co/edit/pSwjxi2vMN61tevArW4F?p=preview" rel="nofollow noreferrer">http://plnkr.co/edit/pSwjxi2vMN61tevArW4F?p=preview</a></p>