Angularjs добавляющие директиву по щелчку

Question

У меня есть таблица, которая имеет это тело

<tbody > 
     <tr ng-repeat="con in mycon | array | filter:search | orderBy:predicate:reverse" 
      ng-click="showhistory($event,con.conid)"> 

      <td >{{ con.fname }}</td> 
      <td >{{ con.lname }}</td> 
     </tr> 

</tbody> 

Когда строка нажмите я называю эту функцию мой мой контроллер

$scope.showhistory = function ($event,cid) { 
     $event.stopPropagation(); 
     var contentTr = angular.element('<con_history ></con_history>'); 
     contentTr.insertAfter(angular.element($event.target).parent()); 
     $compile(contentTr)($scope); 
     $scope.$apply 
    }; 

И я могу видеть, что con_history теги получить добавлено. Но это не дает директивы. Когда я добавить директиву я не вижу Бла Бла, я вижу только con_history тег

это моя директива

app.directive('con_history', function() { 
    return { 
     restrict: 'AE', 
     replace: 'true', 
     template: '<tr><td colspan="11">BLAH BLAH</td></tr>' 
    }; 
}); 

спасибо за любую помощь

Answer 1

Вы не делаете это в угловом образом, Я думаю, что это то, что вы хотите сделать:

<tr ng-repeat="con in mycon | array | filter:search | orderBy:predicate:reverse" 
       ng-click="showhistory($event,con.conid)"> 

    <td >{{ con.fname }}</td> 
    <td >{{ con.lname }}</td> 
</tr> 
<con_history ng-if="historyVisible[con.conid]"></con_history> 

в контроллере

$scope.historyVisible = {}; 
$scope.showhistory = function ($event,cid) { 
     . 
     . 
     $scope.historyVisible[cid] = true; 
     . 
     . 
};