Использовать директиву в ng-повторении таблицы

Question

Я хочу создать настраиваемую строку с двумя строками. Один из видимых и еще один рухнул.

Это мой стол:

<table class="table table-bordered panel panel-default centered"> 
     <thead class="panel-heading"> 
      <tr> 
       <td>..</td> 
       <td>..</td> 
       <td>.. GENERALE</td> 
       <td>..</td> 
      </tr> 
     </thead> 
     <tbody> 
      <table-row ng-repeat="(sottotarget,pubblicazione) in gestTrt.treat.pubblicazioni" sottotarget="sottotarget"></table-row> 
     </tbody> 
    </table> 

Моя директива:

<tr> 
<td> 
    <div class="collapse navbar-collapse"> 
     <a ng-click="tableRow.rowVar = !tableRow.rowVar" role="button"><span class="glyphicon glyphicon-plus-sign"></span></a> 
    </div> 
</td> 
<td>{{tableRow.sottotarget}}</td> 
<td></td> 
<td></td> 
</tr> 
<tr class="collapsed" ng-class="{'collapse' : !tableRow.rowVar}"><td><div>Should be collapsed</div></td></tr> 

С кодом JS:

export function tableRow(): angular.IDirective { 

return { 
    restrict: 'E', 
    scope: { 
    sottotarget: '=sottotarget' 
    }, 
    templateUrl: '...', 
    controller: TableRowController, 
    controllerAs: 'tableRow', 
    bindToController: true 
}; 
} 

export class TableRowController { 
    public rowVar = false; 
} 

Но в моей странице я представляю себе две директивы, а затем пустой стол.

Answer 1

<div ng-app="" ng-controller="customersCtrl"> 

<table> 

<tr ng-repeat="x in names"> 
<td>{{ x.Name }}</td> 
<td>{{ x.Country }}</td> 


</tr> 
</table> 

</div> 

Answer 2

Я решил с помощью

<tbody ng-repeat="(sottotarget,pubblicazione) in gestTrt.treat.pubblicazioni"> 
      <tr> 
       <td> 
        <div class="collapse navbar-collapse" ng-init="collapsed = true"> 
         <a ng-click="collapsed = !collapsed" role="button"><span class="glyphicon glyphicon-plus-sign"></span></a> 
        </div> 
       </td> 
       <td>{{tableRow.sottotarget}}</td> 
       <td></td> 
       <td></td> 
      </tr> 
      <tr class="collapsed" ng-class="{'collapse' : collapsed}"> 
       <td colspan="4"><div>Should be collapsed</div></td> 
      </tr> 
     </tbody>