<table>
      <tr>
        <th>Firstname</th>
        <th>Lastname</th>
        <th>Age</th>
      </tr>
      <tr>
        <td>Jill</td>
        <td>Smith</td>
        <td>50</td>
      </tr>
      <tr>
        <td>Eve</td>
        <td>Jackson</td>
        <td>94</td>
      </tr>
    </table>

<table style="width:100%">
  <tr>
    <th>Company</th>
    <th>Address</th>
    <th>City</th>
  </tr>
  <tr>
    <td>Jill</td>
    <td>Smith</td>
    <td>50</td>
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td>
    <td>94</td>
  </tr>
</table>

var tableDirective = function(){
    return {
       restrict: 'EA', //E = element, A = attribute, C = class, M = comment
        scope: {
            data: '='
            },
            templateUrl: 'table-directive.html',
        }
};

angular.module('myModule').directive('tableDirective', tableDirective);

<table style="width:100%">
  <tr>
    <th ng-repeat="item in data.headList">{{ item.name }}</th>
  </tr>
  <tr ng-repeat="item in data.rowList">
    <td>{{ item.name }}</td>
    <td>{{ item.surname }}</td>
    <td>{{ item.propertyName }}</td>
  </tr>
</table>

<table-directive data="data"></table-directive>

...
$scope.data = {
   headList: [{ name: 'Company' }, { name: 'Address' }, { name: 'City' }],
   rowList: // here will be your data
}
...